新增流量包添加编辑功能

src/api/path/system.api.js

@@ -88,4 +88,15 @@ export function getSTSInfoList(params) {
 // 获取首页数据
 export function getHomeData(){
   return service.get('/admin/platform/homeData')
-}
+}
+
+// 添加流量包
+export function addFlowPackage(data) {
+  return service.post('/metadata/createDataPlan', data)
+}
+
+// 修改流量包
+
+export function updateFlowPackage(data) {
+  return service.post('/metadata/updateDataPlan', data)
+}

src/views/admin/flowPool/rearFlowPool/index.vue

@@ -98,7 +98,7 @@ const processData = (data) => {
     const afterSecondConversion = afterFirstConversion / 1024;
     const result = Math.ceil(afterSecondConversion * 100) / 100;
     const dataUsage = result.toFixed(2);
-    return {
+    return { 
       ...item,
       sourceName: filterDict(sourceList.value, item.source), // 运营商名称
       Activated: item.cardAct + "/" + item.iccidCount,

src/views/admin/order/SetmealOrder/index.vue

@@ -0,0 +1,102 @@
+<template>
+    <div class="silent-expire-alarm">
+        <!-- 搜索条件区 -->
+        <div class="search-section">
+            <Search :SearchForm="SearchFormBuyOrder" @query="intData" @reset="reset" />
+        </div>
+        <!-- 数据表格 -->
+        <a-table :data="tableData" :pagination="pageData" :columns="SetMealOrder" @page-change="evChangePage"
+            :scroll="{ x: 'auto' }">
+        </a-table>
+    </div>
+</template>
+
+<script setup>
+import { ref, onMounted, toRefs } from 'vue';
+import Search from '@/components/Search/index.vue'
+import { useI18n } from 'vue-i18n'
+import { Returncolumns, SearchFormBuyOrder } from '../config'
+const { t } = useI18n();
+// 数据层
+const state = ref({
+    tableData: [],
+    pageData: {
+        total: 0,
+        size: 10,
+        current: 1,
+    },
+});
+
+const {
+    tableData,
+    pageData,
+} = toRefs(state.value);
+
+const reset = (item) => {
+    SearchForm.value = item,
+        pageData.value.current = 1,
+        intData()
+}
+
+
+onMounted(() => {
+    intData();
+})
+</script>
+
+<style scoped lang="less">
+.silent-expire-alarm {
+    padding: 20px !important;
+    // background: #fcf;
+}
+
+.setting {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.search-section {
+    margin-bottom: 20px;
+}
+
+.arco-table-th {
+    white-space: nowrap;
+}
+
+.audit-txt {
+    display: flex;
+    flex-wrap: wrap;
+
+    .audit-tag {
+        width: 180px;
+        color: #b2b2b2;
+        margin-right: 20px;
+
+        span {
+            color: #000;
+            margin-left: 20px;
+        }
+    }
+}
+
+.audit-btn {
+    margin-bottom: 10px;
+}
+
+
+
+.detail-table {
+    margin-top: 20px;
+}
+
+.line_heis {
+    color: #FF8839;
+    cursor: pointer;
+    display: inline-block;
+}
+
+.line_heis:hover {
+    color: #168cff;
+}
+</style>

src/views/admin/order/WithdrawalManagement/index.vue

@@ -0,0 +1,102 @@
+<template>
+    <div class="silent-expire-alarm">
+        <!-- 搜索条件区 -->
+        <div class="search-section">
+            <Search :SearchForm="SearchFormWithdrawalManagement" @query="intData" @reset="reset" />
+        </div>
+        <!-- 数据表格 -->
+        <a-table :data="tableData" :pagination="pageData" :columns="WithdrawalManagement" @page-change="evChangePage"
+            :scroll="{ x: 'auto' }">
+        </a-table>
+    </div>
+</template>
+
+<script setup>
+import { ref, onMounted, toRefs } from 'vue';
+import Search from '@/components/Search/index.vue'
+import { useI18n } from 'vue-i18n'
+import { WithdrawalManagement, SearchFormWithdrawalManagement } from '../config'
+const { t } = useI18n();
+// 数据层
+const state = ref({
+    tableData: [],
+    pageData: {
+        total: 0,
+        size: 10,
+        current: 1,
+    },
+});
+
+const {
+    tableData,
+    pageData,
+} = toRefs(state.value);
+
+const reset = (item) => {
+    SearchForm.value = item,
+        pageData.value.current = 1,
+        intData()
+}
+
+
+onMounted(() => {
+    intData();
+})
+</script>
+
+<style scoped lang="less">
+.silent-expire-alarm {
+    padding: 20px !important;
+    // background: #fcf;
+}
+
+.setting {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.search-section {
+    margin-bottom: 20px;
+}
+
+.arco-table-th {
+    white-space: nowrap;
+}
+
+.audit-txt {
+    display: flex;
+    flex-wrap: wrap;
+
+    .audit-tag {
+        width: 180px;
+        color: #b2b2b2;
+        margin-right: 20px;
+
+        span {
+            color: #000;
+            margin-left: 20px;
+        }
+    }
+}
+
+.audit-btn {
+    margin-bottom: 10px;
+}
+
+
+
+.detail-table {
+    margin-top: 20px;
+}
+
+.line_heis {
+    color: #FF8839;
+    cursor: pointer;
+    display: inline-block;
+}
+
+.line_heis:hover {
+    color: #168cff;
+}
+</style>

src/views/admin/order/config.js

@@ -2,7 +2,7 @@ export const SearchFormBuyOrder = [
   {
     type: "input",
     label: "订单编号",
-    field: "id", 
+    field: "id",
     value: "", // 双向绑定的值
   },
   {
@@ -17,7 +17,7 @@ export const SearchFormBuyOrder = [
   {
     type: "input",
     label: "客户名称",
-    field: "userName", 
+    field: "userName",
     value: "", // 双向绑定的值
   },
   {
@@ -65,61 +65,138 @@ export const SearchFormBuyOrder = [
 
 // 购卡订单
 export const BuyOrdercolumns = [
-  { title:  window.$t('order.SerialNumber'), dataIndex: 'index', align: 'center', ellipsis: true },
-  { title:  window.$t('order.OrderNum'), slotName: 'id', align: 'center', ellipsis: true },
-  { title:  window.$t('order.AuditStatus'), slotName: 'statusType', align: 'center', ellipsis: true },
-  { title:  window.$t('order.LogisticsStatus'), slotName: 'LogisticsStatus', align: 'center', ellipsis: true },
-  { title:  window.$t('lotCard.userName'), dataIndex: 'userName', align: 'center', ellipsis: true },
-  { title:  window.$t('order.NumberCardsPurchased'), dataIndex: 'quantity', align: 'center', ellipsis: true },
-  { title:  window.$t('order.SilentPeriod') + ( window.$t('lotCard.month')), dataIndex: 'periodOfSilence', align: 'center', ellipsis: true },
-  { title:  window.$t('order.CardType'), dataIndex: 'cardType', align: 'center', ellipsis: true },
-  { title:  window.$t('order.CarrierName'), dataIndex: 'sourceName', align: 'center', ellipsis: true },
-  { title:  '套餐计划名称', dataIndex: 'terminalName', align: 'center', ellipsis: true },
-  { title:  '套餐计划类型', dataIndex: 'type', align: 'center', ellipsis: true },
-  { title:  window.$t('order.PurchaseAmount'), dataIndex: 'amount', align: 'center', ellipsis: true },
-  { title:  window.$t('order.ContractPhoto'), slotName: 'image', align: 'center', ellipsis: true },
-  { title:  window.$t('order.OrderTime'), dataIndex: 'createdAt', align: 'center', ellipsis: true },
-  { title:  window.$t('lotCard.validity'), dataIndex: 'endDate', align: 'center', ellipsis: true },
+  { title: window.$t('order.SerialNumber'), dataIndex: 'index', align: 'center', ellipsis: true },
+  { title: window.$t('order.OrderNum'), slotName: 'id', align: 'center', ellipsis: true },
+  { title: window.$t('order.AuditStatus'), slotName: 'statusType', align: 'center', ellipsis: true },
+  { title: window.$t('order.LogisticsStatus'), slotName: 'LogisticsStatus', align: 'center', ellipsis: true },
+  { title: window.$t('lotCard.userName'), dataIndex: 'userName', align: 'center', ellipsis: true },
+  { title: window.$t('order.NumberCardsPurchased'), dataIndex: 'quantity', align: 'center', ellipsis: true },
+  { title: window.$t('order.SilentPeriod') + (window.$t('lotCard.month')), dataIndex: 'periodOfSilence', align: 'center', ellipsis: true },
+  { title: window.$t('order.CardType'), dataIndex: 'cardType', align: 'center', ellipsis: true },
+  { title: window.$t('order.CarrierName'), dataIndex: 'sourceName', align: 'center', ellipsis: true },
+  { title: '套餐计划名称', dataIndex: 'terminalName', align: 'center', ellipsis: true },
+  { title: '套餐计划类型', dataIndex: 'type', align: 'center', ellipsis: true },
+  { title: window.$t('order.PurchaseAmount'), dataIndex: 'amount', align: 'center', ellipsis: true },
+  { title: window.$t('order.ContractPhoto'), slotName: 'image', align: 'center', ellipsis: true },
+  { title: window.$t('order.OrderTime'), dataIndex: 'createdAt', align: 'center', ellipsis: true },
+  { title: window.$t('lotCard.validity'), dataIndex: 'endDate', align: 'center', ellipsis: true },
   { title: '备注', dataIndex: 'moderationNotes', align: 'center', ellipsis: true },
-  { title:  window.$t('lotCard.Controls'), slotName: 'operate', align: 'center', ellipsis: true ,fixed: 'right',},
+  { title: window.$t('lotCard.Controls'), slotName: 'operate', align: 'center', ellipsis: true, fixed: 'right', },
 ];
 
 // 退卡订单
 export const Returncolumns = [
-  { title:  window.$t('order.SerialNumber'), dataIndex: 'index', align: 'center', ellipsis: true },
-  { title:  window.$t('order.OrderNum'), slotName: 'id', align: 'center', ellipsis: true },
-  { title:  window.$t('order.AuditStatus'), slotName: 'statusType', align: 'center', ellipsis: true },
-  { title:  window.$t('order.LogisticsStatus'), slotName: 'LogisticsStatus', align: 'center', ellipsis: true },
-  { title:  window.$t('lotCard.userName'), dataIndex: 'userName', align: 'center', ellipsis: true },
-  { title:  window.$t('order.NumberCardsPurchased'), dataIndex: 'quantity', align: 'center', ellipsis: true },
-  { title:  window.$t('order.SilentPeriod') + ( window.$t('lotCard.month')), dataIndex: 'periodOfSilence', align: 'center', ellipsis: true },
-  { title:  window.$t('order.CardType'), dataIndex: 'cardType', align: 'center', ellipsis: true },
-  { title:  window.$t('order.CarrierName'), dataIndex: 'sourceName', align: 'center', ellipsis: true },
-  { title:  window.$t('order.tariff'), dataIndex: 'trafficName', align: 'center', ellipsis: true },
-  { title:  window.$t('order.PurchaseAmount'), dataIndex: 'amount', align: 'center', ellipsis: true },
-  { title:  window.$t('order.ContractPhoto'), slotName: 'image', align: 'center', ellipsis: true },
-  { title:  window.$t('order.OrderTime'), dataIndex: 'createdAt', align: 'center', ellipsis: true },
-  { title:  window.$t('lotCard.validity'), dataIndex: 'endDate', align: 'center', ellipsis: true },
+  { title: window.$t('order.SerialNumber'), dataIndex: 'index', align: 'center', ellipsis: true },
+  { title: window.$t('order.OrderNum'), slotName: 'id', align: 'center', ellipsis: true },
+  { title: window.$t('order.AuditStatus'), slotName: 'statusType', align: 'center', ellipsis: true },
+  { title: window.$t('order.LogisticsStatus'), slotName: 'LogisticsStatus', align: 'center', ellipsis: true },
+  { title: window.$t('lotCard.userName'), dataIndex: 'userName', align: 'center', ellipsis: true },
+  { title: window.$t('order.NumberCardsPurchased'), dataIndex: 'quantity', align: 'center', ellipsis: true },
+  { title: window.$t('order.SilentPeriod') + (window.$t('lotCard.month')), dataIndex: 'periodOfSilence', align: 'center', ellipsis: true },
+  { title: window.$t('order.CardType'), dataIndex: 'cardType', align: 'center', ellipsis: true },
+  { title: window.$t('order.CarrierName'), dataIndex: 'sourceName', align: 'center', ellipsis: true },
+  { title: window.$t('order.tariff'), dataIndex: 'trafficName', align: 'center', ellipsis: true },
+  { title: window.$t('order.PurchaseAmount'), dataIndex: 'amount', align: 'center', ellipsis: true },
+  { title: window.$t('order.ContractPhoto'), slotName: 'image', align: 'center', ellipsis: true },
+  { title: window.$t('order.OrderTime'), dataIndex: 'createdAt', align: 'center', ellipsis: true },
+  { title: window.$t('lotCard.validity'), dataIndex: 'endDate', align: 'center', ellipsis: true },
   { title: '备注', dataIndex: 'moderationNotes', align: 'center', ellipsis: true },
-  { title:  window.$t('lotCard.Controls'), slotName: 'operate', align: 'center', ellipsis: true, fixed: 'right', }
+  { title: window.$t('lotCard.Controls'), slotName: 'operate', align: 'center', ellipsis: true, fixed: 'right', }
 ];
 
 // 变更订单
 export const ChangeOrdercolumns = [
-  { title:  window.$t('order.SerialNumber'), dataIndex: 'index', align: 'center', ellipsis: true },
-  { title:  window.$t('order.OrderNum'), slotName: 'id', align: 'center', ellipsis: true },
-  { title:  window.$t('order.AuditStatus'), slotName: 'statusType', align: 'center', ellipsis: true },
-  { title:  window.$t('order.LogisticsStatus'), slotName: 'LogisticsStatus', align: 'center', ellipsis: true },
-  { title:  window.$t('lotCard.userName'), dataIndex: 'userName', align: 'center', ellipsis: true },
-  { title:  window.$t('order.NumberCardsPurchased'), dataIndex: 'quantity', align: 'center', ellipsis: true },
-  { title:  window.$t('order.SilentPeriod') + ( window.$t('lotCard.month')), dataIndex: 'periodOfSilence', align: 'center', ellipsis: true },
-  { title:  window.$t('order.CardType'), dataIndex: 'cardType', align: 'center', ellipsis: true },
-  { title:  window.$t('order.CarrierName'), dataIndex: 'sourceName', align: 'center', ellipsis: true },
-  { title:  window.$t('order.tariff'), dataIndex: 'trafficName', align: 'center', ellipsis: true },
-  { title:  window.$t('order.PurchaseAmount'), dataIndex: 'amount', align: 'center', ellipsis: true },
-  { title:  window.$t('order.ContractPhoto'), slotName: 'image', align: 'center', ellipsis: true },
-  { title:  window.$t('order.OrderTime'), dataIndex: 'createdAt', align: 'center', ellipsis: true },
-  { title:  window.$t('lotCard.validity'), dataIndex: 'endDate', align: 'center', ellipsis: true },
+  { title: window.$t('order.SerialNumber'), dataIndex: 'index', align: 'center', ellipsis: true },
+  { title: window.$t('order.OrderNum'), slotName: 'id', align: 'center', ellipsis: true },
+  { title: window.$t('order.AuditStatus'), slotName: 'statusType', align: 'center', ellipsis: true },
+  { title: window.$t('order.LogisticsStatus'), slotName: 'LogisticsStatus', align: 'center', ellipsis: true },
+  { title: window.$t('lotCard.userName'), dataIndex: 'userName', align: 'center', ellipsis: true },
+  { title: window.$t('order.NumberCardsPurchased'), dataIndex: 'quantity', align: 'center', ellipsis: true },
+  { title: window.$t('order.SilentPeriod') + (window.$t('lotCard.month')), dataIndex: 'periodOfSilence', align: 'center', ellipsis: true },
+  { title: window.$t('order.CardType'), dataIndex: 'cardType', align: 'center', ellipsis: true },
+  { title: window.$t('order.CarrierName'), dataIndex: 'sourceName', align: 'center', ellipsis: true },
+  { title: window.$t('order.tariff'), dataIndex: 'trafficName', align: 'center', ellipsis: true },
+  { title: window.$t('order.PurchaseAmount'), dataIndex: 'amount', align: 'center', ellipsis: true },
+  { title: window.$t('order.ContractPhoto'), slotName: 'image', align: 'center', ellipsis: true },
+  { title: window.$t('order.OrderTime'), dataIndex: 'createdAt', align: 'center', ellipsis: true },
+  { title: window.$t('lotCard.validity'), dataIndex: 'endDate', align: 'center', ellipsis: true },
   { title: '备注', dataIndex: 'moderationNotes', align: 'center', ellipsis: true },
-  { title:  window.$t('lotCard.Controls'), slotName: 'operate', align: 'center', ellipsis: true, fixed: 'right', },
-];
+  { title: window.$t('lotCard.Controls'), slotName: 'operate', align: 'center', ellipsis: true, fixed: 'right', },
+];
+
+
+// 提现管理
+export const SearchFormWithdrawalManagement = [
+  {
+    type: "input",
+    label: "订单编号",
+    field: "id",
+    value: "", // 双向绑定的值
+  },
+  {
+    type: "select",
+    label: "提现币种",
+    field: "moderationStatus",
+    options: [], // 默认空，后面会通过字典加载
+    dict: "currencyType",
+    value: "", // 双向绑定的值
+    width: "200",
+  },
+  {
+    type: "select",
+    label: "提现状态",
+    field: "moderationStatus",
+    options: [], // 默认空，后面会通过字典加载
+    dict: "",
+    value: "", // 双向绑定的值
+    width: "200",
+  },
+  {
+    type: "select",
+    label: "转账方式",
+    field: "periodOfSilence",
+    options: [], // 默认空，后面会通过字典加载
+    dict: "",
+    value: "", // 双向绑定的值
+    width: "200",
+  },
+  {
+    type: "date-picker",
+    label: "申请时间",
+    field: "createdAt",
+    value: "", // 双向绑定的值
+    width: "200",
+  },
+  {
+    type: "date-picker",
+    label: "审核时间",
+    field: "createdAt",
+    value: "", // 双向绑定的值
+    width: "200",
+  },
+  {
+    type: "date-picker",
+    label: "结算时间",
+    field: "endData",
+    value: "", // 双向绑定的值
+    width: "200",
+  },
+]
+
+
+export const WithdrawalManagement = [
+  { title: '流水ID', dataIndex: 'index', align: 'center', ellipsis: true },
+  { title: '提现币种', slotName: 'id', align: 'center', ellipsis: true },
+  { title: '申请提现金额', slotName: 'statusType', align: 'center', ellipsis: true },
+  { title: '提现手续费', slotName: 'LogisticsStatus', align: 'center', ellipsis: true },
+  { title: '提现实收金额', dataIndex: 'userName', align: 'center', ellipsis: true },
+  { title: '汇率', dataIndex: 'quantity', align: 'center', ellipsis: true },
+  { title: '实付金额', dataIndex: 'periodOfSilence', align: 'center', ellipsis: true },
+  { title: '实付手续费', dataIndex: 'cardType', align: 'center', ellipsis: true },
+  { title: '实付金额', dataIndex: 'sourceName', align: 'center', ellipsis: true },
+  { title: '提现状态', dataIndex: 'trafficName', align: 'center', ellipsis: true },
+  { title: '申请时间', dataIndex: 'amount', align: 'center', ellipsis: true },
+  { title: '审核时间', slotName: 'image', align: 'center', ellipsis: true },
+  { title: '转账方式', dataIndex: 'createdAt', align: 'center', ellipsis: true },
+  { title: '结算时间', dataIndex: 'endDate', align: 'center', ellipsis: true },
+]

src/views/admin/trafficList/NewDataPackageForm.vue

@@ -1,45 +1,78 @@
 <template>
-    <a-modal :visible="visible" :title="editMode ? $t('dataPackage.editDataPackage') : $t('dataPackage.addDataPackage')"
+    <a-modal :visible="visible" :title="localEditMode ? $t('dataPackage.editDataPackage') : $t('dataPackage.addDataPackage')"
         @ok="handleSubmit" @cancel="handleCancel" :width="720">
-        <a-form :model="formData" :rules="rules" ref="formRef">
-            <a-form-item field="packageName" :label="$t('dataPackage.packageName')" required>
-                <a-input v-model="formData.packageName" :placeholder="$t('dataPackage.enterPackageName')" />
-            </a-form-item>
-            <a-form-item field="source" :label="$t('dataPackage.operatorType')" required>
-                <a-select v-model="formData.source" :placeholder="$t('dataPackage.selectOperatorType')">
-                    <a-option v-for="op in operatorTypeOptions" :key="op.value" :value="op.value">
-                        {{ op.label }}
-                    </a-option>
+        <a-form :model="formData" ref="formRef">
+            <a-form-item field="source" label="来源" required>
+                <a-select v-model="formData.source" :style="{ width: '320px' }" placeholder="请选择来源">
+                    <a-option v-for="item in optionSource" :value="item.value" :label="item.label" />
                 </a-select>
             </a-form-item>
-            <a-form-item field="status" :label="$t('dataPackage.statusName')" required>
-                <a-select v-model="formData.status" :placeholder="$t('dataPackage.selectStatus')">
-                    <a-option value="1">{{ $t('dataPackage.status.normal') }}</a-option>
-                    <a-option value="2">{{ $t('dataPackage.status.disabled') }}</a-option>
-                    <a-option value="3">{{ $t('dataPackage.status.offline') }}</a-option>
-                </a-select>
+            <a-form-item field="productId" label="流量包ID" required>
+                <a-input v-model="formData.productId" placeholder="请输入" />
+            </a-form-item>
+            <a-form-item field="productName" label="流量包名称" required>
+                <a-input v-model="formData.productName" placeholder="请输入" />
+            </a-form-item>
+            <a-form-item field="dataZoneId" label="地区ID" required>
+                <a-input v-model="formData.dataZoneId" placeholder="请输入" />
+            </a-form-item>
+            <a-form-item field="dataZoneName" label="地区名称" required>
+                <a-input v-model="formData.dataZoneName" placeholder="请输入" />
+            </a-form-item>
+            <a-form-item field="validDays" label="套餐有效天数" required>
+                <a-input v-model="formData.validDays" placeholder="请输入" />
+            </a-form-item>
+            <a-form-item field="dataTotal" label="套餐可用流量" required>
+                <a-input v-model="formData.dataTotal" placeholder="-1表示无限流量 单位MB" />
+            </a-form-item>
+            <a-form-item field="voiceMt" label="语音呼入流量" required>
+                <a-input v-model="formData.voiceMt" placeholder="请输入" />
             </a-form-item>
-            <a-form-item field="packageCode" :label="$t('dataPackage.operatorPackageCode')">
-                <a-input v-model="formData.packageCode" :placeholder="$t('dataPackage.enterOperatorPackageCode')" />
+            <a-form-item field="voiceMo" label="语音呼出流量" required>
+                <a-input v-model="formData.voiceMo" placeholder="请输入" />
             </a-form-item>
-            <a-form-item field="packageSize" :label="$t('dataPackage.packageSize')" required>
-                <a-input-number v-model="formData.packageSize" :placeholder="$t('dataPackage.enterPackageSize')" />
-                <a-select v-model="formData.packageSizeUnit" style="width: 80px; margin-left: 8px;">
-                    <a-option value="MB">MB</a-option>
-                    <a-option value="GB">GB</a-option>
+            <a-form-item field="smsTotal" label="短信总条数" required>
+                <a-input v-model="formData.smsTotal" placeholder="请输入" />
+            </a-form-item>
+            <a-form-item field="dataSpeedDefault" label="默认限速" required>
+                <a-input v-model="formData.dataSpeedDefault" placeholder="请输入" />
+            </a-form-item>
+            <a-form-item field="dataQuota" label="单次请求可用流量" required>
+                <a-input v-model="formData.dataQuota" placeholder="请输入" />
+            </a-form-item>
+            <a-form-item field="validDayType" label="有效期" required>
+                <a-select v-model="formData.validDayType" :style="{ width: '320px' }" placeholder="请选择">
+                    <a-option v-for="item in optionsMount" :value="item.value" :label="item.label" />
                 </a-select>
             </a-form-item>
-            <a-form-item field="standardPrice" :label="$t('dataPackage.standardPrice')" required>
-                <a-input-number v-model="formData.standardPrice" :placeholder="$t('dataPackage.enterStandardPrice')" />
+            <a-form-item field="rateGroupName" label="费率组名称" required>
+                <a-input v-model="formData.rateGroupName" placeholder="请输入" />
+            </a-form-item>
+            <a-form-item field="zoneVoiceMtName" label="语音呼出地区名称" required>
+                <a-input v-model="formData.zoneVoiceMtName" placeholder="请输入" />
+            </a-form-item>
+            <a-form-item field="zoneVoiceMoName" label="语音呼入地区名称" required>
+                <a-input v-model="formData.zoneVoiceMoName" placeholder="请输入" />
+            </a-form-item>
+            <a-form-item field="zoneDataName" label="流量使用地区名称" required>
+                <a-input v-model="formData.zoneDataName" placeholder="请输入" />
+            </a-form-item>
+            <a-form-item field="zoneSmsName" label="短信使用地区名称" required>
+                <a-input v-model="formData.zoneSmsName" placeholder="请输入" />
+            </a-form-item>
+            <a-form-item field="suppliersId" label="供应商ID" required>
+                <a-input v-model="formData.suppliersId" placeholder="请输入" />
             </a-form-item>
         </a-form>
     </a-modal>
 </template>
 
 <script setup>
-import { ref, reactive, watch } from 'vue';
+import { ref, reactive, watch, toRefs, onMounted } from 'vue';
 import { useI18n } from 'vue-i18n';
-
+import { Getdictionary, tableFunction, filterDict } from '@/mixins/index.js'
+import { addFlowPackage, updateFlowPackage } from '@/api/path/system.api'
+import { Message } from '@arco-design/web-vue';
 const { t } = useI18n();
 
 const props = defineProps({
@@ -48,50 +81,103 @@ const props = defineProps({
     editData: Object,
 });
 
+const { visible, editMode } = toRefs(props);
+
 const emit = defineEmits(['update:visible', 'submit']);
+const optionsMount = [
+    { value: 1, label: '一个月' },
+    { value: 2, label: '两个月' },
+    { value: 3, label: '三个月' },
+    { value: 4, label: '四个月' },
+    { value: 5, label: '五个月' },
+    { value: 6, label: '六个月' },
+    { value: 7, label: '七个月' },
+    { value: 8, label: '八个月' },
+    { value: 9, label: '九个月' },
+    { value: 10, label: '十个月' },
+    { value: 11, label: '十一个月' },
+    { value: 12, label: '十二个月' }
+]
+const state = ref({
+    optionSource: [],
+})
+
+const { optionSource } = toRefs(state.value)
 
 const formRef = ref(null);
 const formData = reactive({
-    packageName: '',
-    source: '',
-    status: '',
-    packageCode: '',
-    packageSize: null,
-    packageSizeUnit: 'MB',
-    standardPrice: null,
+    source: null,
+    productId: null,
+    productName: null,
+    dataZoneId: null,
+    dataZoneName: null,
+    validDays: null,
+    voiceMt: null,
+    voiceMo: null,
+    smsTotal: null,
+    dataSpeedDefault: null,
+    dataQuota: null,
+    validDayType: null,
+    rateGroupName: null,
+    zoneVoiceMtName: null,
+    zoneVoiceMoName: null,
+    zoneDataName: null,
+    zoneSmsName: null,
+    suppliersId: 7,
+    dataTotal:null
 });
 
-const rules = {
-    packageName: [{ required: true, message: t('dataPackage.packageNameRequired') }],
-    source: [{ required: true, message: t('dataPackage.operatorTypeRequired') }],
-    status: [{ required: true, message: t('dataPackage.statusRequired') }],
-    packageSize: [{ required: true, message: t('dataPackage.packageSizeRequired') }],
-    standardPrice: [{ required: true, message: t('dataPackage.standardPriceRequired') }],
-};
+const localEditMode = ref(props.editMode);
+
+watch(() => formData.source, val => {
+    if (val == 'NEWTECH-Universal')
+        switch (val) {
+            case 'NEWTECH-Universal':
+                formData.suppliersId = 2;
+                break;
+            case 'NEWTECH-CMI':
+                formData.suppliersId = 1;
+                break;
+
+            default:
+                formData.suppliersId = 7
+                break;
+        }
+}, { deep: true })
 
-const operatorTypeOptions = [
-    { value: '1', label: t('dataPackage.operatorTypes.chinamobile') },
-    { value: '2', label: t('dataPackage.operatorTypes.chinaunicom') },
-    { value: '3', label: t('dataPackage.operatorTypes.chinatelecom') },
-    { value: '4', label: t('dataPackage.operatorTypes.international') },
-    { value: '5', label: t('dataPackage.operatorTypes.foreign_local') },
-];
 
 watch(() => props.editData, (newVal) => {
     if (newVal) {
         Object.assign(formData, newVal);
-        Object.keys(formData).forEach(key => {
-            if (newVal[key]) {
-                formData[key] = newVal[key]
-            }
+        localEditMode.value = true
+    } else {
+        Object.keys(formData).forEach((key) => {
+            formData[key] = null;
         });
+        formData.source = optionSource.value[optionSource.value.length - 1].value
+        formData.suppliersId = 7
+        localEditMode.value = false
     }
 }, { deep: true });
 
 const handleSubmit = () => {
-    formRef.value.validate((errors) => {
+    formRef.value.validate(async (errors) => {
         if (!errors) {
-            emit('submit', formData);
+            formData.validDays = Number(formData.validDays)
+            formData.dataTotal = Number(formData.dataTotal)
+            formData.voiceMt = Number(formData.voiceMt)
+            formData.voiceMo = Number(formData.voiceMo)
+            formData.smsTotal = Number(formData.smsTotal)
+            formData.dataSpeedDefault = Number(formData.dataSpeedDefault)
+            formData.dataQuota = Number(formData.dataQuota)
+            formData.validDayType = Number(formData.validDayType)
+            
+            let res = localEditMode.value ? await updateFlowPackage(formData) : await addFlowPackage(formData)
+            if (res.code === 200) {
+                Message.success('添加成功')
+                emit('update:visible', false)
+                emit('submit', true)
+            }
         } else {
             console.error('Validation failed', errors);
         }
@@ -100,5 +186,16 @@ const handleSubmit = () => {
 
 const handleCancel = () => {
     emit('update:visible', false);
+    Object.keys(formData).forEach(res => {
+        formData[res] = null
+    })
+    formData.source = optionSource.value[optionSource.value.length - 1].value
+    formData.suppliersId = 7
 };
+
+onMounted(async () => {
+    const dict = await Getdictionary(['source'])
+    optionSource.value = dict[0]
+    formData.source = dict[0][dict[0].length - 1].value
+})
 </script>

src/views/admin/trafficList/config.js

@@ -16,14 +16,13 @@ export const columns = [
   { title: '语音呼入地区名称', dataIndex: 'zoneVoiceMoName', align: 'center', ellipsis: true },
   { title: '流量使用地区名称', dataIndex: 'zoneDataName', align: 'center', ellipsis: true },
   { title: '短信使用地区名称', dataIndex: 'zoneSmsName', align: 'center', ellipsis: true},
-  // {
-  //   title: window.$t('global.common.operations'),
-  //   dataIndex: 'id',
-  //   slotName: 'id',
-  //   align: 'center',
-  //   width: 180,
-  //   fixed: "right",
-  // }
+  {
+    title: window.$t('global.common.operations'),
+    slotName: 'options',
+    align: 'center',
+    width: 180,
+    fixed: "right",
+  }
 ]
 
 export const SearchFormList = [

src/views/admin/trafficList/index.vue

@@ -3,57 +3,62 @@
   <div class="container">
     <!-- 搜索条件区 -->
     <div class="search-section">
-      <Search :SearchForm="SearchFormList" @query="intData" @reset="reset"/>
+      <Search :SearchForm="SearchFormList" @query="intData" @reset="reset" />
+    </div>
+    <div class="add">
+      <a-button type="primary" @click="Info = false;visible = true">新增流量包</a-button>
     </div>
-
-
     <a-table :data="dataSource" :columns="columns" :pagination="pagination" :scroll="{ x: 'auto' }"
       @page-change="evChangePage">
+      <template #options="{ record }">
+        <a-button type="text" @click="EditRecord(record)">编辑</a-button>
+      </template>
     </a-table>
 
+    <NewDataPackageForm :visible="visible" @submit="intData()" :editData="Info" @update:visible="visible = $event"/>
   </div>
 </template>
 
 <script setup>
 import { onMounted, ref } from "vue";
 import { useRoute } from "vue-router";
-import { columns,SearchFormList } from "./config";
+import { columns, SearchFormList } from "./config";
 import { getDataPlanList } from "@/api/path/lotCard.api"
-import {sanitizeObject} from '@/utils/utils'
+import { sanitizeObject } from '@/utils/utils'
 import Search from '@/components/Search/index.vue'
+import NewDataPackageForm from './NewDataPackageForm.vue'
 const searchForm = ref({});
 
-
 const dataSource = ref([]);
 const pagination = ref({
   total: 0,
   pageSize: 10,
   current: 1,
 })
-
+const visible = ref(false)
+const Info = ref(false)
 const intData = async (item) => {
-  if(item){
+  if (item) {
     searchForm.value = item
   }
   const param = {
     current: pagination.value.current,
-    size: pagination.value.pageSize,
+    pageSize: pagination.value.pageSize,
     ...searchForm.value,
   }
   const { data } = await getDataPlanList(param)
   dataSource.value = (data?.records || []).map((item, index) => {
     const total = item.dataTotal == -1 ? '无限流量' : item.dataTotal + "MB"
-    const dataItem = sanitizeObject({...item})
+    const dataItem = sanitizeObject({ ...item })
     return {
       ...dataItem,
       total: total,
-      id: index + 1
     }
   })
   pagination.value.total = data.total
 }
 
-const reset = (item)=>{
+const reset = (item) => {
   searchForm.value = item
   pagination.value.current = 1
   intData()
@@ -65,6 +70,11 @@ const evChangePage = (page) => {
   intData()
 }
 
+const EditRecord = (record) => {
+  Info.value = record
+  visible.value = true
+}
+
 onMounted(() => {
   intData()
 })
@@ -101,4 +111,8 @@ onMounted(() => {
 .audit-btn {
   margin-bottom: 10px;
 }
+
+.add {
+  margin-bottom: 20px;
+}
 </style>

src/views/home/index.vue

@@ -181,7 +181,7 @@
             </div>
           </div>
           <div class="flowCard">
-            <div class="title">总充值订单金额/新元</div>
+            <div class="title">总充值订单金额</div>
             <div class="main">
               <div class="value">{{ rechargeInfo?.totalAllRechargeAmount[0]?.amount }}</div>
               <div class="txt">{{ rechargeInfo?.totalAllRechargeAmount[0]?.currency }}</div>