0017
/
iot-ui-vue
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: 物联卡及数据解析替换

This commit is contained in:
wzyyy 2023-03-02 20:43:33 +08:00
parent 2607f9aace
commit 4d8f68dabb
18 changed files with 302 additions and 301 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
src/views/device/Instance/Detail/Parsing/index.vue
View File

@ -1,6 +1,6 @@
<template> <template>
<a-card> <j-card>
<div> <div>
<div class="top"> <div class="top">
<div class="top-left"> <div class="top-left">
@ -25,9 +25,9 @@
</div> </div>
<div> <div>
脚本语言: 脚本语言:
<a-select :defaultValue="'JavaScript'" style="width: 200;margin-left: 5px;"> <j-select :defaultValue="'JavaScript'" style="width: 200;margin-left: 5px;">
<a-select-option value="JavaScript">JavaScript(ECMAScript 5)</a-select-option> <j-select-option value="JavaScript">JavaScript(ECMAScript 5)</j-select-option>
</a-select> </j-select>
<AIcon type="ExpandOutlined" style="margin-left: 20px;" @click="toggle" /> <AIcon type="ExpandOutlined" style="margin-left: 20px;" @click="toggle" />
</div> </div>
</div> </div>
@ -42,7 +42,7 @@
}) })
}"></div> }"></div>
<MonacoEditor language="javascript" style="height: 100%;" theme="vs" v-model:modelValue="editorValue" /> <j-monaco-editor language="javascript" style="height: 100%;" theme="vs" v-model:modelValue="editorValue" />
</div> </div>
<div class="bottom"> <div class="bottom">
<div style="width: 49.5%;"> <div style="width: 49.5%;">
@ -51,25 +51,25 @@
<div class="bottom-title-topic"> <div class="bottom-title-topic">
<template v-if="instanceStore.current.transport === 'MQTT'"> <template v-if="instanceStore.current.transport === 'MQTT'">
<div style="margin-right: 5px;">Topic:</div> <div style="margin-right: 5px;">Topic:</div>
<a-auto-complete placeholder="请输入Topic" style="width: 300px" :options="topicList" <j-auto-complete placeholder="请输入Topic" style="width: 300px" :options="topicList"
:allowClear="true" :filterOption="(inputValue: any, option: any) => :allowClear="true" :filterOption="(inputValue: any, option: any) =>
option!.value.indexOf(inputValue) !== -1" v-model:value="topic" /> option!.value.indexOf(inputValue) !== -1" v-model:value="topic" />
</template> </template>
<template v-else> <template v-else>
<div style="margin-right: 5px;">URL:</div> <div style="margin-right: 5px;">URL:</div>
<a-input placeholder="请输入URL" v-model:value="url" style="width: 300px"></a-input> <j-input placeholder="请输入URL" v-model:value="url" style="width: 300px"></j-input>
</template> </template>
</div> </div>
</div> </div>
<a-textarea :rows="5" placeholder="// 二进制数据以0x开头的十六进制输入，字符串数据输入原始字符串" style="margin-top: 10px;" <j-textarea :rows="5" placeholder="// 二进制数据以0x开头的十六进制输入，字符串数据输入原始字符串" style="margin-top: 10px;"
v-model:value="simulation" /> v-model:value="simulation" />
</div> </div>
<div style="width: 49.5%;"> <div style="width: 49.5%;">
<div class="bottom-title"> <div class="bottom-title">
<div class="bottom-title-text">运行结果</div> <div class="bottom-title-text">运行结果</div>
</div> </div>
<a-textarea :autoSize="{ minRows: 5 }" :style="resStyle" v-model:value="result" /> <j-textarea :autoSize="{ minRows: 5 }" :style="resStyle" v-model:value="result" />
</div> </div>
</div> </div>
</div> </div>
@ -87,13 +87,13 @@
保存 保存
</PermissionButton> </PermissionButton>
</div> </div>
</a-card> </j-card>
</template> </template>
<script setup lang='ts' name="Parsing"> <script setup lang='ts' name="Parsing">
import AIcon from '@/components/AIcon' import AIcon from '@/components/AIcon'
import PermissionButton from '@/components/PermissionButton/index.vue' import PermissionButton from '@/components/PermissionButton/index.vue'
import MonacoEditor from '@/components/MonacoEditor/index.vue'; // import MonacoEditor from '@/components/MonacoEditor/index.vue';
import { useFullscreen } from '@vueuse/core' import { useFullscreen } from '@vueuse/core'
import { useInstanceStore } from '@/store/instance'; import { useInstanceStore } from '@/store/instance';
import { import {

22
src/views/device/Product/Detail/DataAnalysis/index.vue
View File

@ -1,18 +1,18 @@
<template> <template>
<a-card> <j-card>
<div> <div>
<div class="top"> <div class="top">
<div> <div>
脚本语言: 脚本语言:
<a-select :defaultValue="'JavaScript'" style="width: 200;margin-left: 5px;"> <j-select :defaultValue="'JavaScript'" style="width: 200;margin-left: 5px;">
<a-select-option value="JavaScript">JavaScript(ECMAScript 5)</a-select-option> <j-select-option value="JavaScript">JavaScript(ECMAScript 5)</j-select-option>
</a-select> </j-select>
<AIcon type="ExpandOutlined" style="margin-left: 20px;" @click="toggle" /> <AIcon type="ExpandOutlined" style="margin-left: 20px;" @click="toggle" />
</div> </div>
</div> </div>
<div class="edit" ref="el"> <div class="edit" ref="el">
<MonacoEditor language="javascript" style="height: 100%;" theme="vs" v-model:modelValue="editorValue" /> <j-monaco-editor language="javascript" style="height: 100%;" theme="vs" v-model:modelValue="editorValue" />
</div> </div>
<div class="bottom"> <div class="bottom">
<div style="width: 49.5%;"> <div style="width: 49.5%;">
@ -21,25 +21,25 @@
<div class="bottom-title-topic"> <div class="bottom-title-topic">
<template v-if="productStore.current.transportProtocol === 'MQTT'"> <template v-if="productStore.current.transportProtocol === 'MQTT'">
<div style="margin-right: 5px;">Topic:</div> <div style="margin-right: 5px;">Topic:</div>
<a-auto-complete placeholder="请输入Topic" style="width: 300px" :options="topicList" <j-auto-complete placeholder="请输入Topic" style="width: 300px" :options="topicList"
:allowClear="true" :filterOption="(inputValue: any, option: any) => :allowClear="true" :filterOption="(inputValue: any, option: any) =>
option!.value.indexOf(inputValue) !== -1" v-model:value="topic" /> option!.value.indexOf(inputValue) !== -1" v-model:value="topic" />
</template> </template>
<template v-else> <template v-else>
<div style="margin-right: 5px;">URL:</div> <div style="margin-right: 5px;">URL:</div>
<a-input placeholder="请输入URL" v-model:value="url" style="width: 300px"></a-input> <j-input placeholder="请输入URL" v-model:value="url" style="width: 300px"></j-input>
</template> </template>
</div> </div>
</div> </div>
<a-textarea :rows="5" placeholder="// 二进制数据以0x开头的十六进制输入，字符串数据输入原始字符串" style="margin-top: 10px;" <j-textarea :rows="5" placeholder="// 二进制数据以0x开头的十六进制输入，字符串数据输入原始字符串" style="margin-top: 10px;"
v-model:value="simulation" /> v-model:value="simulation" />
</div> </div>
<div style="width: 49.5%;"> <div style="width: 49.5%;">
<div class="bottom-title"> <div class="bottom-title">
<div class="bottom-title-text">运行结果</div> <div class="bottom-title-text">运行结果</div>
</div> </div>
<a-textarea :autoSize="{ minRows: 5 }" :style="resStyle" v-model:value="result" /> <j-textarea :autoSize="{ minRows: 5 }" :style="resStyle" v-model:value="result" />
</div> </div>
</div> </div>
</div> </div>
@ -57,13 +57,13 @@
保存 保存
</PermissionButton> </PermissionButton>
</div> </div>
</a-card> </j-card>
</template> </template>
<script setup lang='ts' name="DataAnalysis"> <script setup lang='ts' name="DataAnalysis">
import AIcon from '@/components/AIcon' import AIcon from '@/components/AIcon'
import PermissionButton from '@/components/PermissionButton/index.vue' import PermissionButton from '@/components/PermissionButton/index.vue'
import MonacoEditor from '@/components/MonacoEditor/index.vue'; // import MonacoEditor from '@/components/MonacoEditor/index.vue';
import { useFullscreen } from '@vueuse/core' import { useFullscreen } from '@vueuse/core'
import { useProductStore } from '@/store/product'; import { useProductStore } from '@/store/product';
import { import {

10
src/views/iot-card/CardManagement/BindDevice.vue
View File

@ -1,6 +1,6 @@
<!-- 绑定设备 --> <!-- 绑定设备 -->
<template> <template>
<a-modal <j-modal
:maskClosable="false" :maskClosable="false"
width="1100px" width="1100px"
:visible="true" :visible="true"
@ -18,7 +18,7 @@
@search="handleSearch" @search="handleSearch"
type="simple" type="simple"
/> />
<JTable <j-pro-table
ref="bindDeviceRef" ref="bindDeviceRef"
:columns="columns" :columns="columns"
:request="queryUnbounded" :request="queryUnbounded"
@ -44,14 +44,14 @@
}} }}
</template> </template>
<template #state="slotProps"> <template #state="slotProps">
<a-badge <j-badge
:text="slotProps.state.text" :text="slotProps.state.text"
:status="statusMap.get(slotProps.state.value)" :status="statusMap.get(slotProps.state.value)"
/> />
</template> </template>
</JTable> </j-pro-table>
</div> </div>
</a-modal> </j-modal>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">

104
src/views/iot-card/CardManagement/Detail/index.vue
View File

@ -8,15 +8,15 @@
:data="current" :data="current"
@change="saveChange" @change="saveChange"
/> />
<a-row :gutter="[24, 24]"> <j-row :gutter="[24, 24]">
<a-col :span="24"> <j-col :span="24">
<a-card> <j-card>
<a-descriptions size="small" :column="3" bordered> <j-descriptions size="small" :column="3" bordered>
<template #title> <template #title>
<Guide> <Guide>
<template #title> <template #title>
<span>基本信息</span> <span>基本信息</span>
<a-button <j-button
type="link" type="link"
@click=" @click="
() => { () => {
@ -28,74 +28,74 @@
> >
<AIcon type="EditOutlined"></AIcon> <AIcon type="EditOutlined"></AIcon>
编辑 编辑
</a-button> </j-button>
</template> </template>
</Guide> </Guide>
</template> </template>
<a-descriptions-item label="卡号">{{ <j-descriptions-item label="卡号">{{
detail.id detail.id
}}</a-descriptions-item> }}</j-descriptions-item>
<a-descriptions-item label="ICCID">{{ <j-descriptions-item label="ICCID">{{
detail.iccId detail.iccId
}}</a-descriptions-item> }}</j-descriptions-item>
<a-descriptions-item label="绑定设备">{{ <j-descriptions-item label="绑定设备">{{
detail.deviceName detail.deviceName
}}</a-descriptions-item> }}</j-descriptions-item>
<a-descriptions-item label="平台类型">{{ <j-descriptions-item label="平台类型">{{
detail.operatorPlatformType?.text detail.operatorPlatformType?.text
}}</a-descriptions-item> }}</j-descriptions-item>
<a-descriptions-item label="平台名称">{{ <j-descriptions-item label="平台名称">{{
detail.platformConfigName detail.platformConfigName
}}</a-descriptions-item> }}</j-descriptions-item>
<a-descriptions-item label="运营商">{{ <j-descriptions-item label="运营商">{{
detail.operatorName detail.operatorName
}}</a-descriptions-item> }}</j-descriptions-item>
<a-descriptions-item label="类型">{{ <j-descriptions-item label="类型">{{
detail.cardType?.text detail.cardType?.text
}}</a-descriptions-item> }}</j-descriptions-item>
<a-descriptions-item label="激活日期">{{ <j-descriptions-item label="激活日期">{{
detail.activationDate detail.activationDate
? moment(detail.activationDate).format( ? moment(detail.activationDate).format(
'YYYY-MM-DD HH:mm:ss', 'YYYY-MM-DD HH:mm:ss',
) )
: '' : ''
}}</a-descriptions-item> }}</j-descriptions-item>
<a-descriptions-item label="更新时间">{{ <j-descriptions-item label="更新时间">{{
detail.updateTime detail.updateTime
? moment(detail.updateTime).format( ? moment(detail.updateTime).format(
'YYYY-MM-DD HH:mm:ss', 'YYYY-MM-DD HH:mm:ss',
) )
: '' : ''
}}</a-descriptions-item> }}</j-descriptions-item>
<a-descriptions-item label="总流量">{{ <j-descriptions-item label="总流量">{{
detail.totalFlow detail.totalFlow
? detail.totalFlow.toFixed(2) + ' M' ? detail.totalFlow.toFixed(2) + ' M'
: '' : ''
}}</a-descriptions-item> }}</j-descriptions-item>
<a-descriptions-item label="使用流量">{{ <j-descriptions-item label="使用流量">{{
detail.usedFlow detail.usedFlow
? detail.usedFlow.toFixed(2) + ' M' ? detail.usedFlow.toFixed(2) + ' M'
: '' : ''
}}</a-descriptions-item> }}</j-descriptions-item>
<a-descriptions-item label="剩余流量">{{ <j-descriptions-item label="剩余流量">{{
detail.residualFlow detail.residualFlow
? detail.residualFlow.toFixed(2) + ' M' ? detail.residualFlow.toFixed(2) + ' M'
: '' : ''
}}</a-descriptions-item> }}</j-descriptions-item>
<a-descriptions-item label="状态">{{ <j-descriptions-item label="状态">{{
detail?.cardState?.text detail?.cardState?.text
}}</a-descriptions-item> }}</j-descriptions-item>
<a-descriptions-item label="说明">{{ <j-descriptions-item label="说明">{{
detail?.describe detail?.describe
}}</a-descriptions-item> }}</j-descriptions-item>
</a-descriptions> </j-descriptions>
</a-card> </j-card>
</a-col> </j-col>
<a-col :span="24"> <j-col :span="24">
<!-- 流量统计 --> <!-- 流量统计 -->
<a-row :gutter="24"> <j-row :gutter="24">
<a-col :span="16"> <j-col :span="16">
<div class="card"> <div class="card">
<Guide title="流量统计"> <Guide title="流量统计">
<template #extra> <template #extra>
@ -113,15 +113,15 @@
:chartData="flowData" :chartData="flowData"
/> />
</div> </div>
</a-col> </j-col>
<a-col :span="8"> <j-col :span="8">
<div class="card"> <div class="card">
<Guide title="数据统计" /> <Guide title="数据统计" />
<div class="static-info" style="min-height: 490px"> <div class="static-info" style="min-height: 490px">
<div class="data-statistics-item"> <div class="data-statistics-item">
<div class="flow-info" style="width: 100%"> <div class="flow-info" style="width: 100%">
<div class="label">昨日流量消耗</div> <div class="label">昨日流量消耗</div>
<a-tooltip placement="bottomLeft"> <j-tooltip placement="bottomLeft">
<template #title> <template #title>
<span>{{ dayTotal }} M</span> <span>{{ dayTotal }} M</span>
</template> </template>
@ -129,7 +129,7 @@
{{ dayTotal }} {{ dayTotal }}
<span class="unit">M</span> <span class="unit">M</span>
</div> </div>
</a-tooltip> </j-tooltip>
</div> </div>
<LineChart <LineChart
color="#FBA500" color="#FBA500"
@ -139,7 +139,7 @@
<div class="data-statistics-item"> <div class="data-statistics-item">
<div class="flow-info" style="width: 100%"> <div class="flow-info" style="width: 100%">
<div class="label">当月流量消耗</div> <div class="label">当月流量消耗</div>
<a-tooltip placement="bottomLeft"> <j-tooltip placement="bottomLeft">
<template #title> <template #title>
<span>{{ monthTotal }} M</span> <span>{{ monthTotal }} M</span>
</template> </template>
@ -147,14 +147,14 @@
{{ monthTotal }} {{ monthTotal }}
<span class="unit">M</span> <span class="unit">M</span>
</div> </div>
</a-tooltip> </j-tooltip>
</div> </div>
<LineChart :chartData="monthOptions" /> <LineChart :chartData="monthOptions" />
</div> </div>
<div class="data-statistics-item"> <div class="data-statistics-item">
<div class="flow-info" style="width: 100%"> <div class="flow-info" style="width: 100%">
<div class="label">本年流量消耗</div> <div class="label">本年流量消耗</div>
<a-tooltip placement="bottomLeft"> <j-tooltip placement="bottomLeft">
<template #title> <template #title>
<span>{{ yearTotal }} M</span> <span>{{ yearTotal }} M</span>
</template> </template>
@ -162,7 +162,7 @@
{{ yearTotal }} {{ yearTotal }}
<span class="unit">M</span> <span class="unit">M</span>
</div> </div>
</a-tooltip> </j-tooltip>
</div> </div>
<LineChart <LineChart
color="#58E1D3" color="#58E1D3"
@ -171,10 +171,10 @@
</div> </div>
</div> </div>
</div> </div>
</a-col> </j-col>
</a-row> </j-row>
</a-col> </j-col>
</a-row> </j-row>
</page-container> </page-container>
</template> </template>

56
src/views/iot-card/CardManagement/Import.vue
View File

@ -1,6 +1,6 @@
<template> <template>
<!-- 导入 --> <!-- 导入 -->
<a-modal <j-modal
:maskClosable="false" :maskClosable="false"
:visible="true" :visible="true"
title="导入" title="导入"
@ -10,30 +10,30 @@
@cancel="handleCancel" @cancel="handleCancel"
> >
<div style="margin-top: 10px"> <div style="margin-top: 10px">
<a-form :layout="'vertical'"> <j-form :layout="'vertical'">
<a-form-item label="平台对接" required> <j-form-item label="平台对接" required>
<a-select <j-select
showSearch showSearch
v-model:value="modelRef.configId" v-model:value="modelRef.configId"
:options="configList" :options="configList"
placeholder="请选择平台对接" placeholder="请选择平台对接"
> >
</a-select> </j-select>
</a-form-item> </j-form-item>
<a-form-item v-if="modelRef.configId" label="文件格式"> <j-form-item v-if="modelRef.configId" label="文件格式">
<a-radio-group <j-radio-group
button-style="solid" button-style="solid"
v-model:value="modelRef.fileType" v-model:value="modelRef.fileType"
placeholder="请选择文件格式" placeholder="请选择文件格式"
> >
<a-radio-button value="xlsx">xlsx</a-radio-button> <j-radio-button value="xlsx">xlsx</j-radio-button>
<a-radio-button value="csv">csv</a-radio-button> <j-radio-button value="csv">csv</j-radio-button>
</a-radio-group> </j-radio-group>
</a-form-item> </j-form-item>
<a-form-item label="文件上传" v-if="modelRef.configId"> <j-form-item label="文件上传" v-if="modelRef.configId">
<a-upload <j-upload
v-model:fileList="modelRef.upload" v-model:fileList="modelRef.upload"
name="file" name="file"
:action="FILE_UPLOAD" :action="FILE_UPLOAD"
@ -44,24 +44,24 @@
:showUploadList="false" :showUploadList="false"
@change="fileChange" @change="fileChange"
> >
<a-button :loading="loading"> <j-button :loading="loading">
<template #icon> <template #icon>
<AIcon type="UploadOutlined" /> <AIcon type="UploadOutlined" />
</template> </template>
文件上传 文件上传
</a-button> </j-button>
</a-upload> </j-upload>
</a-form-item> </j-form-item>
<a-form-item v-if="modelRef.configId" label="下载模板"> <j-form-item v-if="modelRef.configId" label="下载模板">
<a-space> <j-space>
<a-button icon="file" @click="downFileFn('xlsx')"> <j-button icon="file" @click="downFileFn('xlsx')">
.xlsx .xlsx
</a-button> </j-button>
<a-button icon="file" @click="downFileFn('csv')"> <j-button icon="file" @click="downFileFn('csv')">
.csv .csv
</a-button> </j-button>
</a-space> </j-space>
</a-form-item> </j-form-item>
<div v-if="totalCount"> <div v-if="totalCount">
<a-icon class="check-num" type="check" /> 已完成 总数量 <a-icon class="check-num" type="check" /> 已完成 总数量
<span class="check-num">{{ totalCount }}</span> <span class="check-num">{{ totalCount }}</span>
@ -71,9 +71,9 @@
失败 总数量 失败 总数量
<span class="check-num">{{ errCount }}</span> <span class="check-num">{{ errCount }}</span>
</div> </div>
</a-form> </j-form>
</div> </div>
</a-modal> </j-modal>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">

56
src/views/iot-card/CardManagement/Save.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<a-modal <j-modal
:maskClosable="false" :maskClosable="false"
width="600px" width="600px"
:visible="true" :visible="true"
@ -11,39 +11,39 @@
:confirmLoading="btnLoading" :confirmLoading="btnLoading"
> >
<div style="margin-top: 10px"> <div style="margin-top: 10px">
<a-form <j-form
:layout="'vertical'" :layout="'vertical'"
ref="formRef" ref="formRef"
:rules="rules" :rules="rules"
:model="modelRef" :model="modelRef"
> >
<a-form-item label="卡号" name="id"> <j-form-item label="卡号" name="id">
<a-input <j-input
v-model:value="modelRef.id" v-model:value="modelRef.id"
placeholder="请输入卡号" placeholder="请输入卡号"
:disabled="type === 'edit'" :disabled="type === 'edit'"
></a-input> ></j-input>
</a-form-item> </j-form-item>
<a-form-item name="iccId"> <j-form-item name="iccId">
<template #label> <template #label>
<span> <span>
ICCID ICCID
<a-tooltip title="IC卡的唯一识别号码"> <j-tooltip title="IC卡的唯一识别号码">
<AIcon <AIcon
type="QuestionCircleOutlined" type="QuestionCircleOutlined"
style="margin-left: 2px" style="margin-left: 2px"
/> />
</a-tooltip> </j-tooltip>
</span> </span>
</template> </template>
<a-input <j-input
v-model:value="modelRef.iccId" v-model:value="modelRef.iccId"
placeholder="请输入ICCID" placeholder="请输入ICCID"
:disabled="type === 'edit'" :disabled="type === 'edit'"
/> />
</a-form-item> </j-form-item>
<a-form-item label="平台对接" name="platformConfigId"> <j-form-item label="平台对接" name="platformConfigId">
<a-select <j-select
showSearch showSearch
:filter-option="filterOption" :filter-option="filterOption"
:disabled="type === 'edit'" :disabled="type === 'edit'"
@ -52,11 +52,11 @@
v-model:value="modelRef.platformConfigId" v-model:value="modelRef.platformConfigId"
placeholder="请选择平台对接" placeholder="请选择平台对接"
> >
</a-select> </j-select>
</a-form-item> </j-form-item>
<a-form-item label="运营商" name="operatorName"> <j-form-item label="运营商" name="operatorName">
<a-select <j-select
allowClear allowClear
showSearch showSearch
:filter-option="filterOption" :filter-option="filterOption"
@ -64,10 +64,10 @@
v-model:value="modelRef.operatorName" v-model:value="modelRef.operatorName"
placeholder="请选择运营商" placeholder="请选择运营商"
> >
</a-select> </j-select>
</a-form-item> </j-form-item>
<a-form-item label="类型" name="cardType"> <j-form-item label="类型" name="cardType">
<a-select <j-select
allowClear allowClear
showSearch showSearch
:disabled="type === 'edit'" :disabled="type === 'edit'"
@ -76,19 +76,19 @@
v-model:value="modelRef.cardType" v-model:value="modelRef.cardType"
placeholder="请选择类型" placeholder="请选择类型"
> >
</a-select> </j-select>
</a-form-item> </j-form-item>
<a-form-item label="说明" name="describe"> <j-form-item label="说明" name="describe">
<a-textarea <j-textarea
v-model:value="modelRef.describe" v-model:value="modelRef.describe"
placeholder="请输入说明" placeholder="请输入说明"
showCount showCount
:maxlength="200" :maxlength="200"
/> />
</a-form-item> </j-form-item>
</a-form> </j-form>
</div> </div>
</a-modal> </j-modal>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>

8
src/views/iot-card/CardManagement/index.vue
View File

@ -2,13 +2,13 @@
<template> <template>
<page-container> <page-container>
<Search :columns="columns" target="iot-card-management-search" @search="handleSearch" /> <Search :columns="columns" target="iot-card-management-search" @search="handleSearch" />
<JTable ref="cardManageRef" :columns="columns" :request="query" <j-pro-table ref="cardManageRef" :columns="columns" :request="query"
:defaultParams="{ sorts: [{ name: 'createTime', order: 'desc' }] }" :rowSelection="{ :defaultParams="{ sorts: [{ name: 'createTime', order: 'desc' }] }" :rowSelection="{
selectedRowKeys: _selectedRowKeys, selectedRowKeys: _selectedRowKeys,
onChange: onSelectChange, onChange: onSelectChange,
}" @cancelSelect="cancelSelect" :params="params" :gridColumn="3"> }" @cancelSelect="cancelSelect" :params="params" :gridColumn="3">
<template #headerTitle> <template #headerTitle>
<a-space> <j-space>
<a-button type="primary" @click="handleAdd"> <a-button type="primary" @click="handleAdd">
<AIcon type="PlusOutlined" />新增 <AIcon type="PlusOutlined" />新增
</a-button> </a-button>
@ -80,7 +80,7 @@
</a-menu> </a-menu>
</template> </template>
</a-dropdown> </a-dropdown>
</a-space> </j-space>
</template> </template>
<template #card="slotProps"> <template #card="slotProps">
<CardBox :value="slotProps" @click="handleClick" :actions="getActions(slotProps, 'card')" v-bind="slotProps" <CardBox :value="slotProps" @click="handleClick" :actions="getActions(slotProps, 'card')" v-bind="slotProps"
@ -265,7 +265,7 @@
</template> </template>
</a-space> </a-space>
</template> </template>
</JTable> </j-pro-table>
<!-- 批量导入 --> <!-- 批量导入 -->
<Import v-if="importVisible" @close="importVisible = false" /> <Import v-if="importVisible" @close="importVisible = false" />
<!-- 批量导出 --> <!-- 批量导出 -->

54
src/views/iot-card/Dashboard/index.vue
View File

@ -2,14 +2,14 @@
<template> <template>
<page-container> <page-container>
<div class="card-dashboard-container"> <div class="card-dashboard-container">
<a-card style="margin-bottom: 24px"> <j-card style="margin-bottom: 24px">
<a-row :gutter="24"> <j-row :gutter="24">
<a-col :span="24"><Guide title="数据统计" /></a-col> <j-col :span="24"><Guide title="数据统计" /></j-col>
<a-col :span="8"> <j-col :span="8">
<div class="data-statistics-item"> <div class="data-statistics-item">
<div class="flow-info" style="width: 100%"> <div class="flow-info" style="width: 100%">
<div class="label">昨日流量消耗</div> <div class="label">昨日流量消耗</div>
<a-tooltip placement="bottomLeft"> <j-tooltip placement="bottomLeft">
<template #title> <template #title>
<span>{{ dayTotal }} M</span> <span>{{ dayTotal }} M</span>
</template> </template>
@ -17,19 +17,19 @@
{{ dayTotal }} {{ dayTotal }}
<span class="unit">M</span> <span class="unit">M</span>
</div> </div>
</a-tooltip> </j-tooltip>
</div> </div>
<LineChart <LineChart
color="#FBA500" color="#FBA500"
:chartData="dayOptions" :chartData="dayOptions"
/> />
</div> </div>
</a-col> </j-col>
<a-col :span="8"> <j-col :span="8">
<div class="data-statistics-item"> <div class="data-statistics-item">
<div class="flow-info" style="width: 100%"> <div class="flow-info" style="width: 100%">
<div class="label">当月流量消耗</div> <div class="label">当月流量消耗</div>
<a-tooltip placement="bottomLeft"> <j-tooltip placement="bottomLeft">
<template #title> <template #title>
<span>{{ monthTotal }} M</span> <span>{{ monthTotal }} M</span>
</template> </template>
@ -37,16 +37,16 @@
{{ monthTotal }} {{ monthTotal }}
<span class="unit">M</span> <span class="unit">M</span>
</div> </div>
</a-tooltip> </j-tooltip>
</div> </div>
<LineChart :chartData="monthOptions" /> <LineChart :chartData="monthOptions" />
</div> </div>
</a-col> </j-col>
<a-col :span="8"> <j-col :span="8">
<div class="data-statistics-item"> <div class="data-statistics-item">
<div class="flow-info" style="width: 100%"> <div class="flow-info" style="width: 100%">
<div class="label">本年流量消耗</div> <div class="label">本年流量消耗</div>
<a-tooltip placement="bottomLeft"> <j-tooltip placement="bottomLeft">
<template #title> <template #title>
<span>{{ yearTotal }} M</span> <span>{{ yearTotal }} M</span>
</template> </template>
@ -54,18 +54,18 @@
{{ yearTotal }} {{ yearTotal }}
<span class="unit">M</span> <span class="unit">M</span>
</div> </div>
</a-tooltip> </j-tooltip>
</div> </div>
<LineChart <LineChart
color="#58E1D3" color="#58E1D3"
:chartData="yearOptions" :chartData="yearOptions"
/> />
</div> </div>
</a-col> </j-col>
</a-row> </j-row>
</a-card> </j-card>
<a-row :gutter="24"> <j-row :gutter="24">
<a-col :span="16"> <j-col :span="16">
<div class="static-card"> <div class="static-card">
<Guide title="流量统计"> <Guide title="流量统计">
<template #extra> <template #extra>
@ -85,11 +85,11 @@
:chartData="flowData" :chartData="flowData"
/> />
<div class="empty-body" v-else> <div class="empty-body" v-else>
<a-empty :image="Empty.PRESENTED_IMAGE_SIMPLE" /> <j-empty :image="Empty.PRESENTED_IMAGE_SIMPLE" />
</div> </div>
</div> </div>
</a-col> </j-col>
<a-col :span="8"> <j-col :span="8">
<div class="static-card"> <div class="static-card">
<Guide title="流量使用TOP10"> <Guide title="流量使用TOP10">
<template #extra> <template #extra>
@ -118,7 +118,7 @@
</div> </div>
<div class="cardNum">{{ item.cardNum }}</div> <div class="cardNum">{{ item.cardNum }}</div>
<div class="progress"> <div class="progress">
<a-progress <j-progress
:strokeColor="'#ADC6FF'" :strokeColor="'#ADC6FF'"
:trailColor="'#E0E4E8'" :trailColor="'#E0E4E8'"
:strokeLinecap="'butt'" :strokeLinecap="'butt'"
@ -128,7 +128,7 @@
(item.value / topTotal) * 100, (item.value / topTotal) * 100,
) )
" "
></a-progress> ></j-progress>
</div> </div>
<div class="total"> <div class="total">
{{ item?.value?.toFixed(2) }} M {{ item?.value?.toFixed(2) }} M
@ -136,11 +136,11 @@
</div> </div>
</div> </div>
<div class="empty-body" v-else> <div class="empty-body" v-else>
<a-empty :image="Empty.PRESENTED_IMAGE_SIMPLE" /> <j-empty :image="Empty.PRESENTED_IMAGE_SIMPLE" />
</div> </div>
</div> </div>
</a-col> </j-col>
</a-row> </j-row>
</div> </div>
</page-container> </page-container>
</template> </template>

18
src/views/iot-card/Home/index.vue
View File

@ -1,8 +1,8 @@
<!-- 物联卡-首页 --> <!-- 物联卡-首页 -->
<template> <template>
<page-container> <page-container>
<a-row :gutter="24"> <j-row :gutter="24">
<a-col :span="14"> <j-col :span="14">
<div class="home-guide"> <div class="home-guide">
<Guide title="物联卡引导"></Guide> <Guide title="物联卡引导"></Guide>
<div <div
@ -25,8 +25,8 @@
</div> </div>
</div> </div>
</div> </div>
</a-col> </j-col>
<a-col :span="10"> <j-col :span="10">
<div class="home-statistics"> <div class="home-statistics">
<Guide title="基础统计"> <Guide title="基础统计">
<template #extra> <template #extra>
@ -71,8 +71,8 @@
</div> </div>
</div> </div>
</div> </div>
</a-col> </j-col>
<a-col :span="24" style="min-height: 580px"> <j-col :span="24" style="min-height: 580px">
<div class="home-body"> <div class="home-body">
<Guide <Guide
title="平台架构图" title="平台架构图"
@ -82,22 +82,20 @@
<img :src="getImage('/iot-card/iotcard-home.png')" /> <img :src="getImage('/iot-card/iotcard-home.png')" />
</div> </div>
</div> </div>
</a-col> </j-col>
</a-row> </j-row>
</page-container> </page-container>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { getImage } from '@/utils/comm'; import { getImage } from '@/utils/comm';
import Guide from '../components/Guide.vue'; import Guide from '../components/Guide.vue';
import { message } from 'ant-design-vue';
import moment from 'moment'; import moment from 'moment';
import { queryFlow, list } from '@/api/iot-card/home'; import { queryFlow, list } from '@/api/iot-card/home';
import * as echarts from 'echarts'; import * as echarts from 'echarts';
import { useMenuStore } from '@/store/menu'; import { useMenuStore } from '@/store/menu';
import { usePermissionStore } from '@/store/permission'; import { usePermissionStore } from '@/store/permission';
const router = useRouter();
const { proxy } = <any>getCurrentInstance(); const { proxy } = <any>getCurrentInstance();
interface GuideItemProps { interface GuideItemProps {

100
src/views/iot-card/Platform/Detail/index.vue
View File

@ -1,16 +1,16 @@
<template> <template>
<page-container> <page-container>
<a-card> <j-card>
<a-row :gutter="24"> <j-row :gutter="24">
<a-col :span="14"> <j-col :span="14">
<TitleComponent data="详情" /> <TitleComponent data="详情" />
<a-form <j-form
:layout="'vertical'" :layout="'vertical'"
ref="formRef" ref="formRef"
:rules="rules" :rules="rules"
:model="form" :model="form"
> >
<a-form-item <j-form-item
label="平台类型" label="平台类型"
name="operatorName" name="operatorName"
required required
@ -28,104 +28,104 @@
v-model:value="form.operatorName" v-model:value="form.operatorName"
@change="typeChange" @change="typeChange"
></PlatformType ></PlatformType
></a-form-item> ></j-form-item>
<a-form-item label="名称" name="name"> <j-form-item label="名称" name="name">
<a-input <j-input
v-model:value="form.name" v-model:value="form.name"
placeholder="请输入名称" placeholder="请输入名称"
/> />
</a-form-item> </j-form-item>
<!-- onelink --> <!-- onelink -->
<div v-if="form.operatorName === 'onelink'"> <div v-if="form.operatorName === 'onelink'">
<a-form-item label="App ID" name="appId"> <j-form-item label="App ID" name="appId">
<a-input <j-input
v-model:value="form.appId" v-model:value="form.appId"
placeholder="请输入App ID" placeholder="请输入App ID"
/> />
</a-form-item> </j-form-item>
<a-form-item label="Password" name="passWord"> <j-form-item label="Password" name="passWord">
<a-input-password <j-input-password
v-model:value="form.passWord" v-model:value="form.passWord"
placeholder="请输入密码" placeholder="请输入密码"
/> />
</a-form-item> </j-form-item>
<a-form-item label="接口地址" name="apiAddr"> <j-form-item label="接口地址" name="apiAddr">
<a-input <j-input
v-model:value="form.apiAddr" v-model:value="form.apiAddr"
placeholder="请输入接口地址" placeholder="请输入接口地址"
/> />
</a-form-item> </j-form-item>
</div> </div>
<!-- ctwing --> <!-- ctwing -->
<div v-if="form.operatorName === 'ctwing'"> <div v-if="form.operatorName === 'ctwing'">
<a-form-item label="用户id" name="userId"> <j-form-item label="用户id" name="userId">
<a-input <j-input
v-model:value="form.userId" v-model:value="form.userId"
placeholder="请输入用户id" placeholder="请输入用户id"
/> />
</a-form-item> </j-form-item>
<a-form-item label="密码" name="passWord"> <j-form-item label="密码" name="passWord">
<a-input-password <j-input-password
v-model:value="form.passWord" v-model:value="form.passWord"
placeholder="请输入密码" placeholder="请输入密码"
/> />
</a-form-item> </j-form-item>
<a-form-item label="secretKey" name="secretKey"> <j-form-item label="secretKey" name="secretKey">
<a-input <j-input
v-model:value="form.secretKey" v-model:value="form.secretKey"
placeholder="请输入secretKey" placeholder="请输入secretKey"
/> />
</a-form-item> </j-form-item>
</div> </div>
<!-- unicom --> <!-- unicom -->
<div v-if="form.operatorName === 'unicom'"> <div v-if="form.operatorName === 'unicom'">
<a-form-item label="App ID" name="appId"> <j-form-item label="App ID" name="appId">
<a-input <j-input
v-model:value="form.appId" v-model:value="form.appId"
placeholder="请输入App ID" placeholder="请输入App ID"
/> />
</a-form-item> </j-form-item>
<a-form-item label="App Secret" name="appSecret"> <j-form-item label="App Secret" name="appSecret">
<a-input <j-input
v-model:value="form.appSecret" v-model:value="form.appSecret"
placeholder="请输入App Secret" placeholder="请输入App Secret"
/> />
</a-form-item> </j-form-item>
<a-form-item label="创建者ID" name="openId"> <j-form-item label="创建者ID" name="openId">
<a-input <j-input
v-model:value="form.openId" v-model:value="form.openId"
placeholder="请输入创建者ID" placeholder="请输入创建者ID"
/> />
</a-form-item> </j-form-item>
</div> </div>
<a-form-item label="说明" name="explain"> <j-form-item label="说明" name="explain">
<a-textarea <j-textarea
v-model:value="form.explain" v-model:value="form.explain"
placeholder="请输入说明" placeholder="请输入说明"
showCount showCount
:rows="3" :rows="3"
:maxlength="200" :maxlength="200"
/> />
</a-form-item> </j-form-item>
<a-form-item> <j-form-item>
<a-divider /> <j-divider />
<a-button <j-button
:loading="saveBtnLoading" :loading="saveBtnLoading"
type="primary" type="primary"
@click="handleSave" @click="handleSave"
> >
保存 保存
</a-button> </j-button>
</a-form-item> </j-form-item>
</a-form> </j-form>
</a-col> </j-col>
<a-col :span="10"> <j-col :span="10">
<Doc :type="form.operatorName" /> <Doc :type="form.operatorName" />
</a-col> </j-col>
</a-row> </j-row>
</a-card> </j-card>
</page-container> </page-container>
</template> </template>

16
src/views/iot-card/Platform/doc/index.vue
View File

@ -24,7 +24,7 @@
获取路径：“中移物联卡能力开放平台”--“个人中心”--“客户信息”--“接入信息” 获取路径：“中移物联卡能力开放平台”--“个人中心”--“客户信息”--“接入信息”
</p> </p>
<div class="image"> <div class="image">
<a-image <j-image
width="100%" width="100%"
:src="getImage('/iot-card/onelink-appid.png')" :src="getImage('/iot-card/onelink-appid.png')"
/> />
@ -37,7 +37,7 @@
获取路径：“中移物联卡能力开放平台”--“个人中心”--“客户信息”--“接入信息” 获取路径：“中移物联卡能力开放平台”--“个人中心”--“客户信息”--“接入信息”
</p> </p>
<div class="image"> <div class="image">
<a-image <j-image
width="100%" width="100%"
:src="getImage('/iot-card/onelink-pass.png')" :src="getImage('/iot-card/onelink-pass.png')"
/> />
@ -77,7 +77,7 @@
获取路径：“5G连接管理平台”--“能力开放”--“API网关账号管理” 获取路径：“5G连接管理平台”--“能力开放”--“API网关账号管理”
</p> </p>
<div class="image"> <div class="image">
<a-image <j-image
width="100%" width="100%"
:src="getImage('/iot-card/ctwing-id.png')" :src="getImage('/iot-card/ctwing-id.png')"
/> />
@ -90,7 +90,7 @@
获取路径：“5G连接管理平台”--“能力开放”--“API网关账号管理” 获取路径：“5G连接管理平台”--“能力开放”--“API网关账号管理”
</p> </p>
<div class="image"> <div class="image">
<a-image <j-image
width="100%" width="100%"
:src="getImage('/iot-card/ctwing-pass.png')" :src="getImage('/iot-card/ctwing-pass.png')"
/> />
@ -103,7 +103,7 @@
获取路径：“5G连接管理平台”--“能力开放”--“API网关账号管理” 获取路径：“5G连接管理平台”--“能力开放”--“API网关账号管理”
</p> </p>
<div class="image"> <div class="image">
<a-image <j-image
width="100%" width="100%"
:src="getImage('/iot-card/ctwing-secret.png')" :src="getImage('/iot-card/ctwing-secret.png')"
/> />
@ -137,7 +137,7 @@
获取路径：“雁飞智连CMP平台”--“我的应用”--“应用列表” 获取路径：“雁飞智连CMP平台”--“我的应用”--“应用列表”
</p> </p>
<div class="image"> <div class="image">
<a-image <j-image
width="100%" width="100%"
:src="getImage('/iot-card/unicom-id.png')" :src="getImage('/iot-card/unicom-id.png')"
/> />
@ -150,7 +150,7 @@
获取路径：“雁飞智连CMP平台”--“我的应用”--“应用列表” 获取路径：“雁飞智连CMP平台”--“我的应用”--“应用列表”
</p> </p>
<div class="image"> <div class="image">
<a-image <j-image
width="100%" width="100%"
:src="getImage('/iot-card/unicom-secret.png')" :src="getImage('/iot-card/unicom-secret.png')"
/> />
@ -164,7 +164,7 @@
<br /> <br />
</p> </p>
<div class="image"> <div class="image">
<a-image <j-image
width="100%" width="100%"
:src="getImage('/iot-card/unicom-openid.png')" :src="getImage('/iot-card/unicom-openid.png')"
/> />

33
src/views/iot-card/Platform/index.vue
View File

@ -6,7 +6,7 @@
target="platform-search" target="platform-search"
@search="handleSearch" @search="handleSearch"
/> />
<JTable <j-pro-table
ref="platformRef" ref="platformRef"
:columns="columns" :columns="columns"
:request="queryList" :request="queryList"
@ -15,11 +15,14 @@
:gridColumn="3" :gridColumn="3"
> >
<template #headerTitle> <template #headerTitle>
<a-space> <j-space>
<a-button type="primary" @click="handleAdd"> <!-- <j-button type="primary" @click="handleAdd">
<AIcon type="PlusOutlined" />新增 <AIcon type="PlusOutlined" />新增
</a-button> </j-button> -->
</a-space> <PermissionButton @click="handleAdd" :hasPermission="'iot-card/Platform:add'" type="primary">
<AIcon type="PlusOutlined" />新增
</PermissionButton>
</j-space>
</template> </template>
<template #card="slotProps"> <template #card="slotProps">
<CardBox <CardBox
@ -42,18 +45,18 @@
<h3 class="card-item-content-title"> <h3 class="card-item-content-title">
{{ slotProps.name }} {{ slotProps.name }}
</h3> </h3>
<a-row> <j-row>
<a-col :span="12"> <j-col :span="12">
<div class="card-item-content-text"> <div class="card-item-content-text">
平台类型 平台类型
</div> </div>
<div>{{ slotProps.operatorName }}</div> <div>{{ slotProps.operatorName }}</div>
</a-col> </j-col>
<a-col :span="12"> <j-col :span="12">
<div class="card-item-content-text">说明</div> <div class="card-item-content-text">说明</div>
<div>{{ slotProps.explain }}</div> <div>{{ slotProps.explain }}</div>
</a-col> </j-col>
</a-row> </j-row>
</template> </template>
<template #actions="item"> <template #actions="item">
<PermissionButton :disabled="item.disabled" :popConfirm="item.popConfirm" :tooltip="{ <PermissionButton :disabled="item.disabled" :popConfirm="item.popConfirm" :tooltip="{
@ -69,7 +72,7 @@
</CardBox> </CardBox>
</template> </template>
<template #state="slotProps"> <template #state="slotProps">
<a-badge <j-badge
:text="slotProps.state.text" :text="slotProps.state.text"
:status=" :status="
slotProps.state.value === 'disabled' slotProps.state.value === 'disabled'
@ -79,7 +82,7 @@
/> />
</template> </template>
<template #action="slotProps"> <template #action="slotProps">
<a-space :size="16"> <j-space :size="16">
<template <template
v-for="i in getActions(slotProps,'table')" v-for="i in getActions(slotProps,'table')"
:key="i.key" :key="i.key"
@ -98,9 +101,9 @@
<template #icon><AIcon :type="i.icon" /></template> <template #icon><AIcon :type="i.icon" /></template>
</PermissionButton> </PermissionButton>
</template> </template>
</a-space> </j-space>
</template> </template>
</JTable> </j-pro-table>
</page-container> </page-container>
</template> </template>

36
src/views/iot-card/Recharge/Detail.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<a-modal <j-modal
:maskClosable="false" :maskClosable="false"
width="1000px" width="1000px"
:visible="true" :visible="true"
@ -10,40 +10,40 @@
@cancel="handleCancel" @cancel="handleCancel"
> >
<div style="margin-top: 10px"> <div style="margin-top: 10px">
<a-descriptions <j-descriptions
:column="2" :column="2"
bordered bordered
:contentStyle="{ minWidth: '300px' }" :contentStyle="{ minWidth: '300px' }"
:labelStyle="{ minWidth: '120px' }" :labelStyle="{ minWidth: '120px' }"
> >
<a-descriptions-item label="充值金额">{{ <j-descriptions-item label="充值金额">{{
data.chargeMoney data.chargeMoney
}}</a-descriptions-item> }}</j-descriptions-item>
<a-descriptions-item label="账户id">{{ <j-descriptions-item label="账户id">{{
data?.rechargeId data?.rechargeId
}}</a-descriptions-item> }}</j-descriptions-item>
<a-descriptions-item label="平台对接">{{ <j-descriptions-item label="平台对接">{{
data.configName data.configName
}}</a-descriptions-item> }}</j-descriptions-item>
<a-descriptions-item label="订单号">{{ <j-descriptions-item label="订单号">{{
data.orderNumber data.orderNumber
}}</a-descriptions-item> }}</j-descriptions-item>
<a-descriptions-item label="支付方式">{{ <j-descriptions-item label="支付方式">{{
data.paymentType data.paymentType
}}</a-descriptions-item> }}</j-descriptions-item>
<a-descriptions-item label="支付URL"> <j-descriptions-item label="支付URL">
<div style="height: 100px; overflow: auto"> <div style="height: 100px; overflow: auto">
{{ data.url ? data.url : '' }} {{ data.url ? data.url : '' }}
</div> </div>
</a-descriptions-item> </j-descriptions-item>
<a-descriptions-item label="订单时间">{{ <j-descriptions-item label="订单时间">{{
data.createTime data.createTime
? moment(data.createTime).format('YYYY-MM-DD HH:mm:ss') ? moment(data.createTime).format('YYYY-MM-DD HH:mm:ss')
: '-' : '-'
}}</a-descriptions-item> }}</j-descriptions-item>
</a-descriptions> </j-descriptions>
</div> </div>
</a-modal> </j-modal>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>

36
src/views/iot-card/Recharge/Save.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<a-modal <j-modal
:maskClosable="false" :maskClosable="false"
width="600px" width="600px"
:visible="true" :visible="true"
@ -17,14 +17,14 @@
style="margin-right: 6px" style="margin-right: 6px"
/>暂只支持移动OneLink平台 />暂只支持移动OneLink平台
</div> </div>
<a-form <j-form
layout="vertical" layout="vertical"
ref="formRef" ref="formRef"
:rules="rules" :rules="rules"
:model="modelRef" :model="modelRef"
> >
<a-form-item label="平台对接" name="configId"> <j-form-item label="平台对接" name="configId">
<a-select <j-select
v-model:value="modelRef.configId" v-model:value="modelRef.configId"
:options="configList" :options="configList"
allowClear allowClear
@ -32,16 +32,16 @@
style="width: 100%" style="width: 100%"
placeholder="请选择平台对接" placeholder="请选择平台对接"
> >
</a-select> </j-select>
</a-form-item> </j-form-item>
<a-form-item label="账户id" name="rechargeId"> <j-form-item label="账户id" name="rechargeId">
<a-input <j-input
v-model:value="modelRef.rechargeId" v-model:value="modelRef.rechargeId"
placeholder="请输入账户id" placeholder="请输入账户id"
/> />
</a-form-item> </j-form-item>
<a-form-item label="充值金额" name="chargeMoney"> <j-form-item label="充值金额" name="chargeMoney">
<a-input-number <j-input-number
allowClear allowClear
:precision="2" :precision="2"
style="width: 100%" style="width: 100%"
@ -50,20 +50,20 @@
:max="500" :max="500"
placeholder="请输入1~500之间的金额" placeholder="请输入1~500之间的金额"
/> />
</a-form-item> </j-form-item>
<a-form-item label="支付方式" name="paymentType"> <j-form-item label="支付方式" name="paymentType">
<a-select <j-select
allowClear allowClear
:options="PaymentMethod" :options="PaymentMethod"
v-model:value="modelRef.paymentType" v-model:value="modelRef.paymentType"
placeholder="请选择支付方式" placeholder="请选择支付方式"
> >
</a-select> </j-select>
</a-form-item> </j-form-item>
</a-form> </j-form>
</div> </div>
</a-modal> </j-modal>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>

12
src/views/iot-card/Recharge/index.vue
View File

@ -2,10 +2,10 @@
<template> <template>
<page-container> <page-container>
<Search :columns="columns" target="recharge-search" @search="handleSearch" /> <Search :columns="columns" target="recharge-search" @search="handleSearch" />
<JTable ref="rechargeRef" :columns="columns" :request="queryRechargeList" model="TABLE" <j-pro-table ref="rechargeRef" :columns="columns" :request="queryRechargeList" model="TABLE"
:defaultParams="{ sorts: [{ name: 'createTime', order: 'desc' }] }" :params="params"> :defaultParams="{ sorts: [{ name: 'createTime', order: 'desc' }] }" :params="params">
<template #headerTitle> <template #headerTitle>
<a-space> <j-space>
<PermissionButton @click="visible = true" :hasPermission="'iot-card/Recharge:pay'" type="primary"> <PermissionButton @click="visible = true" :hasPermission="'iot-card/Recharge:pay'" type="primary">
充值 充值
</PermissionButton> </PermissionButton>
@ -15,7 +15,7 @@
</span> </span>
本平台仅提供充值入口，具体充值结果需以运营商的充值结果为准 本平台仅提供充值入口，具体充值结果需以运营商的充值结果为准
</div> </div>
</a-space> </j-space>
</template> </template>
<template #createTime="slotProps"> <template #createTime="slotProps">
{{ {{
@ -27,7 +27,7 @@
}} }}
</template> </template>
<template #action="slotProps"> <template #action="slotProps">
<a-space :size="16"> <j-space :size="16">
<template <template
v-for="i in getActions(slotProps)" v-for="i in getActions(slotProps)"
:key="i.key" :key="i.key"
@ -46,9 +46,9 @@
<template #icon><AIcon :type="i.icon" /></template> <template #icon><AIcon :type="i.icon" /></template>
</PermissionButton> </PermissionButton>
</template> </template>
</a-space> </j-space>
</template> </template>
</JTable> </j-pro-table>
<!-- 充值 --> <!-- 充值 -->
<Save v-if="visible" @change="saveChange" /> <Save v-if="visible" @change="saveChange" />
<Detail v-if="detailVisible" :data="current" @close="close" /> <Detail v-if="detailVisible" :data="current" @close="close" />

4
src/views/iot-card/Record/index.vue
View File

@ -6,7 +6,7 @@
target="record-search" target="record-search"
@search="handleSearch" @search="handleSearch"
/> />
<JTable <j-pro-table
ref="RecordRef" ref="RecordRef"
:columns="columns" :columns="columns"
:request="queryList" :request="queryList"
@ -21,7 +21,7 @@
: '' : ''
}} }}
</template> </template>
</JTable> </j-pro-table>
</page-container> </page-container>
</template> </template>

8
src/views/iot-card/components/TimeSelect.vue
View File

@ -1,20 +1,20 @@
<template> <template>
<div> <div>
<a-radio-group <j-radio-group
v-if="quickBtn" v-if="quickBtn"
default-value="today" default-value="today"
button-style="solid" button-style="solid"
v-model:value="radioValue" v-model:value="radioValue"
@change="(e) => handleBtnChange(e.target.value)" @change="(e) => handleBtnChange(e.target.value)"
> >
<a-radio-button <j-radio-button
v-for="item in quickBtnList" v-for="item in quickBtnList"
:key="item.value" :key="item.value"
:value="item.value" :value="item.value"
> >
{{ item.label }} {{ item.label }}
</a-radio-button> </j-radio-button>
</a-radio-group> </j-radio-group>
<a-range-picker <a-range-picker
format="YYYY-MM-DD" format="YYYY-MM-DD"
valueFormat="YYYY-MM-DD" valueFormat="YYYY-MM-DD"

8
yarn.lock
View File

@ -3896,10 +3896,10 @@ jetlinks-store@^0.0.3:
resolved "https://registry.npmjs.org/jetlinks-store/-/jetlinks-store-0.0.3.tgz" resolved "https://registry.npmjs.org/jetlinks-store/-/jetlinks-store-0.0.3.tgz"
integrity sha512-AZf/soh1hmmwjBZ00fr1emuMEydeReaI6IBTGByQYhTmK1Zd5pQAxC7WLek2snRAn/HHDgJfVz2hjditKThl6Q== integrity sha512-AZf/soh1hmmwjBZ00fr1emuMEydeReaI6IBTGByQYhTmK1Zd5pQAxC7WLek2snRAn/HHDgJfVz2hjditKThl6Q==
jetlinks-ui-components@^1.0.0: jetlinks-ui-components@^1.0.1:
version "1.0.0" version "1.0.1"
resolved "https://registry.jetlinks.cn/jetlinks-ui-components/-/jetlinks-ui-components-1.0.0.tgz#dca7bb82e53f464990b0851635e8f82be6c69db6" resolved "https://registry.jetlinks.cn/jetlinks-ui-components/-/jetlinks-ui-components-1.0.1.tgz#d9e6f5bd9b98523fb4708269be9b4e9bba3437b9"
integrity sha512-pgJ0Uiw4Dxc0AU2GqaOaVhNYun1VEmv78OtJcir2sq9rVSIuXCtTl1eHYMPiiPb6z1fG677KKs1gqvrpUwhguQ== integrity sha512-P8ykIynH6ti9c4KndFfHu/dwewqiWm4Gjki4e+IlCJcwq1at2iokWAITOVm9UsBnEBqWhTQowpK6vlSyTlW+9g==
dependencies: dependencies:
"@vueuse/core" "^9.12.0" "@vueuse/core" "^9.12.0"
ant-design-vue "^3.2.15" ant-design-vue "^3.2.15"