commit

src/components/Layout/components/layout/blendLeft.vue

@@ -34,7 +34,6 @@
           <a-menu :selectedKeys="routeItemSelectedKeys" id="layout-sider" theme="light" mode="vertical"
             :collapsed="false" :auto-open="true">
             <template v-for="routeItem in menuSecondData?.children || []">
-              <!-- {{ routeItem }} -->
               <a-menu-item v-if="!routeItem.children || routeItem.children.length === 0"
                 :key="routeItem.name?.toString()" @click="evGoPage(routeItem)">
                 <span class="menu-level-font">{{ routeItem.meta.title }}</span>

src/components/Search/index.vue

@@ -5,7 +5,7 @@
             <a-form :model="formState" layout="inline">
                 <a-form-item v-for="(item, index) in showIcon ? data : InitialData" :key="index" :label="item.label"
                     :field="item.field" :wrapper-col-style="{ marginBottom: '20px' }">
-                    <component :is="'a-' + item.type" v-model="formState[item.field].value"
+                    <component :is="'a-' + item.type" v-model="formState[item.field]" item.Custom
                         :placeholder="item.type == 'input' ? '请输入' : '请选择' + item.label" allow-clear
                         :style="{ width: item.width ? item.width + 'px' : '' }">
                         <template v-if="item.type == 'select'">
@@ -18,20 +18,18 @@
                 <a-form-item>
                     <a-button type="primary" @click="handleQuery">查询</a-button>
                     <a-button @click="handleReset" style="margin-left: 10px;">重置</a-button>
+                    <div v-if="show" @click="showIcon = !showIcon" class="icon">
+                        {{ showIcon ? '折叠' : '展开' }} <icon-down :rotate="showIcon ? 180 : 0" />
+                    </div>
                 </a-form-item>
             </a-form>
         </div>
-
-        <div v-if="show" @click="showIcon = !showIcon" class="icon">
-            {{ showIcon ? '折叠' : '展开' }} &nbsp; <icon-down :rotate="showIcon ? 180 : 0" />
-        </div>
     </div>
 </template>
 
 <script setup>
-import { ref, defineProps, toRefs, watch, defineEmits } from 'vue';
-import { Getdictionary } from "@/mixins/index.js";
-
+import { ref, watch, defineProps, defineEmits, toRefs } from 'vue';
+import { Getdictionary } from '@/mixins/index.js'
 // 接收 props
 const props = defineProps({
     SearchForm: {
@@ -41,21 +39,21 @@ const props = defineProps({
                 type: 'input',
                 label: '字典名称',
                 field: 'source',
-                value: '', // 双向绑定的值
+                value: '',
             },
             {
                 type: 'input',
                 label: '资费ID',
                 field: 'trafficId',
-                value: '', // 双向绑定的值
+                value: '',
             },
             {
                 type: 'select',
                 label: '卡类型',
                 field: 'simType',
-                options: [], // 默认空，后面会通过字典加载
+                options: [],
                 dict: 'CardType',
-                value: '', // 双向绑定的值
+                value: '',
                 width: '200'
             },
         ],
@@ -64,20 +62,18 @@ const props = defineProps({
 
 const { SearchForm } = toRefs(props);
 
+// 保存原始的SearchForm副本
+const originalSearchForm = ref([]);
+
 // 分割完成的数据
-const InitialData = ref()
-const show = ref(false)
-const showIcon = ref(false)
+const InitialData = ref();
+const show = ref(false);
+const showIcon = ref(false);
 const formState = ref({});
 
-const data = ref()
+const data = ref();
 
-const emit = defineEmits(['query'])
-SearchForm.value.forEach(item => {
-    formState.value[item.field] = {
-        value: item.value,
-    };
-});
+const emit = defineEmits(['query', 'reset']);
 
 // 字典加载
 const loadedDicts = ref({});
@@ -91,35 +87,48 @@ const loadDictOptions = async (index, dict) => {
     SearchForm.value[index].options = loadedDicts.value[dict];
 };
 
-watch(
-    () => SearchForm.value,
-    async () => {
-        for (let index = 0; index < SearchForm.value.length; index++) {
-            const item = SearchForm.value[index];
-            if (item.dict && !loadedDicts.value[item.dict]) {
-                await loadDictOptions(index, item.dict);
-            }
-        }
-        // 如果当前长度超过5条就需要折叠展开
-        if (SearchForm.value.length >= 6) {
-            show.value = true;
+// 在watch首次执行或者组件挂载完成时保存原始副本
+watch(() => SearchForm.value, () => {
+    if (originalSearchForm.value.length === 0) {
+        originalSearchForm.value = [...SearchForm.value];
+    }
+    for (let index = 0; index < SearchForm.value.length; index++) {
+        const item = SearchForm.value[index];
+        if (item.dict && !loadedDicts.value[item.dict]) {
+            loadDictOptions(index, item.dict);
         }
-        // 初始化切割数组
-        InitialData.value = SearchForm.value.splice(0, 6)
-        data.value = [...InitialData.value, ...SearchForm.value]
-    }, { immediate: true });
+    }
+    // 如果当前长度超过5条就需要折叠展开
+    if (originalSearchForm.value.length >= 6) {
+        show.value = true;
+    }
+    // 基于原始副本进行数组分割操作
+    InitialData.value = originalSearchForm.value.splice(0, 6);
+    data.value = [...InitialData.value, ...originalSearchForm.value];
+}, { immediate: true, deep: true });
 
 // 查询操作
 const handleQuery = () => {
-    // 将表单数据通过事件传递给父组件
     emit('query', formState.value);
 };
 
+// 重置操作，正确更新formState并触发reset事件
 const handleReset = () => {
-    SearchForm.value.forEach(res => {
-        res.value = '';
-    })
-}
+    const newFormState = {};
+    SearchForm.value.forEach(item => {
+        if (typeof item.value === 'string') {
+            newFormState[item.field] = '';
+        } else if (Array.isArray(item.value)) {
+            newFormState[item.field] = [];
+        } else if (typeof item.value === 'object') {
+            newFormState[item.field] = {};
+        }
+    });
+    formState.value = newFormState;
+    emit('reset', formState.value);
+};
+
+
 
 </script>
 
@@ -129,15 +138,17 @@ const handleReset = () => {
     justify-content: space-between;
 }
 
-.Form{
+.Form {
     width: 95%;
 }
 
-.icon{
+.icon {
     display: flex;
     // align-items: center;
     color: #3491fa;
-    font-size: 18px;
+    font-size: 15px;
     cursor: pointer;
+    font-weight: 600;
+    margin-left: 15px;
 }
 </style>

src/i18n/zh/tariffManagement.js

@@ -39,12 +39,14 @@ export default {
     SetMeal:'套餐',
     SelectiveTrafficPacket:'选择流量包',
     BasicInformation:'基本信息',
-    DataPackage:'流量包',
     BillingInformation:'计费信息',
     PackageTermMonth:'套餐期限(月)',
     PackagePrice:'套餐价格',
     Currency:'币种',
     AddPackage:'添加套餐',
     endDate:'有效期',
-    BillingMode:'计费方式'
+    BillingMode:'计费方式',
+    TestFlowPacket:'测试流量包',
+    simDataPlanIdName:'流量包名称',
+    TestFlowPacketName:'测试流量包名称'
 }

src/views/lotCard/cardList/config.js

@@ -196,13 +196,13 @@ export const SearchForm = [
   {
     type: "input",
     label: "ICCID",
-    field: "source",
+    field: "iccid",
     value: "", // 双向绑定的值
   },
   {
     type: "select",
     label: "来源",
-    field: "simType",
+    field: "source",
     options: [], // 默认空，后面会通过字典加载
     dict: "source",
     value: "", // 双向绑定的值
@@ -211,13 +211,13 @@ export const SearchForm = [
   {
     type: "input",
     label: "客户名称",
-    field: "source",
+    field: "username",
     value: "", // 双向绑定的值
   },
   {
     type: "input",
     label: "IMSI",
-    field: "source",
+    field: "currentImsi",
     value: "", // 双向绑定的值
   },
   {
@@ -225,23 +225,23 @@ export const SearchForm = [
     label: "流量包状态",
     field: "simType",
     options: [], // 默认空，后面会通过字典加载
-    dict: "source",
+    dict: "account",
     value: "", // 双向绑定的值
     width: "200",
   },
   {
     type: "select",
     label: "SIM状态",
-    field: "simType",
+    field: "iccidstatus",
     options: [], // 默认空，后面会通过字典加载
-    dict: "source",
+    dict: "account",
     value: "", // 双向绑定的值
     width: "200",
   },
   {
     type: "date-picker",
     label: "SIM激活日期",
-    field: "simType",
+    field: "activeTime",
     options: [], // 默认空，后面会通过字典加载
     dict: "source",
     value: "", // 双向绑定的值
@@ -250,7 +250,7 @@ export const SearchForm = [
   {
     type: "date-picker",
     label: "SIM关闭日期",
-    field: "simType",
+    field: "closeTime",
     options: [], // 默认空，后面会通过字典加载
     dict: "source",
     value: "", // 双向绑定的值
@@ -259,7 +259,7 @@ export const SearchForm = [
   {
     type: "input",
     label: "IMSI所属供应商名称 ",
-    field: "simType",
+    field: "currentImsiProvider",
     options: [], // 默认空，后面会通过字典加载
     dict: "source",
     value: "", // 双向绑定的值

src/views/lotCard/cardList/index.vue

@@ -3,7 +3,7 @@
   <div class="container">
     <!-- 搜索条件区 -->
     <div class="search-section">
-       <Search :SearchForm="SearchForm"/>
+       <Search :SearchForm="SearchForm" @query="intData" @reset="reset"/>
     </div>
 
     <a-table row-key="iccid" :data="dataSource" :columns="columns" :pagination="false" :scroll="{ x: 'auto' }">
@@ -23,7 +23,7 @@
     </a-table>
 
     <div class="pagtion">
-      <a-pagination :total="pagination.total" show-total show-jumper show-page-size @change="evChangePage"
+      <a-pagination :total="pagination.total" v-model:current="pagination.current " show-total show-jumper show-page-size @change="evChangePage"
         @page-size-change="pagesChange" />
     </div>
     <!-- 查看流量消耗 -->
@@ -49,6 +49,7 @@ const statusList = ref([]);
 const sourceList = ref([]);
 const serviceList = ref([]);
 const dataSource = ref([]);
+const SearchFormList = ref({});
 const pagination = ref({
   total: 0,
   pageSize: 10,
@@ -59,10 +60,14 @@ const showAdd = ref(false)
 const trafficUseDialogRef = ref()
 
 
-const intData = async () => {
+const intData = async (item) => {
+  if(item){
+    SearchFormList.value = item
+  }
   const param = {
     current: pagination.value.current,
     size: pagination.value.pageSize,
+    ...SearchFormList.value
   }
   const { data } = await cardInfoList(param)
   dataSource.value = (data.records || []).map((item, index) => {
@@ -83,6 +88,12 @@ const intData = async () => {
   pagination.value.total = data.total
 }
 
+const reset = (item)=>{
+  pagination.value.current = 1
+  SearchFormList.value = item
+  intData()
+}
+
 // 详情
 const handletrafficUseDialog = (data) => {
   trafficUseDialogRef.value.open(data)

src/views/order/BuyCard/index.vue

@@ -3,7 +3,7 @@
   <div class="silent-expire-alarm">
     <!-- 搜索条件区 -->
     <div class="search-section">
-      <Search />
+      <Search :SearchForm="SearchFormBuyOrder" @reset="reset"/>
     </div>
     <div class="audit-btn" v-if="userType == 2">
       <a-button @click="showAudit = true" type="text">
@@ -113,6 +113,7 @@ import Search from '@/components/Search/index.vue'
 import returnCard from './returnCard.vue'
 import {useI18n} from 'vue-i18n'
 const {t} = useI18n();
+import {SearchFormBuyOrder} from '../config'
 // 数据层
 const state = ref({
   userName: localStorage.getItem('user_login_information')?.username,
@@ -145,7 +146,8 @@ const state = ref({
   formEndDate: {
     id: '',
     endDate: ''
-  }
+  },
+  SearchForm:{}
 });
 
 const {
@@ -164,7 +166,8 @@ const {
   showPrning,
   formPreing,
   showEndDate,
-  formEndDate
+  formEndDate,
+  SearchForm
 } = toRefs(state.value);
 
 const columns = [
@@ -186,10 +189,14 @@ const columns = [
 ];
 
 // 订单列表
-const intData = async () => {
+const intData = async (item) => {
+  if(item){
+    SearchForm.value = item
+  }
   const param = {
     current: pageData.value.current,
     size: pageData.value.size,
+    ...SearchForm.value
   }
   const simTypeList = await Getdictionary('cardType')
   let sourceList = await Getdictionary('source')
@@ -206,8 +213,13 @@ const intData = async () => {
     });
     pageData.value.total = res.data.total;
   })
-
 }
+
+const reset = (item)=>[
+  SearchForm.value = item,
+  pageData.value.current = 1,
+  intData()
+]
 // 用户退订
 const adminCancel = (data) => {
   TariffOrderCard({ id: data.trafficId }).then(res => {
@@ -268,6 +280,7 @@ const closeModal = (items, obj) => {
 const openPriceing = (data) => {
   showPrning.value = true;
   formPreing.value.id = data.id
+  formPreing.value.amount = data.amount;
 }
 
 const handelPriceing = async () => {
@@ -279,6 +292,7 @@ const handelPriceing = async () => {
   if (res.code === 200) {
     Message.success(res.message)
     closeModal(showPrning.value, formPreing.value)
+    intData()
   }
 }
 

src/views/order/config.js

@@ -0,0 +1,64 @@
+export const SearchFormBuyOrder = [
+  {
+    type: "input",
+    label: "订单编号",
+    field: "id", 
+    value: "", // 双向绑定的值
+  },
+  {
+    type: "select",
+    label: "审核状态",
+    field: "moderationStatus",
+    options: [], // 默认空，后面会通过字典加载
+    dict: "source",
+    value: "", // 双向绑定的值
+    width: "200",
+  },
+  {
+    type: "input",
+    label: "客户名称",
+    field: "userName", 
+    value: "", // 双向绑定的值
+  },
+  {
+    type: "select",
+    label: "沉默期",
+    field: "periodOfSilence",
+    options: [], // 默认空，后面会通过字典加载
+    dict: "silenceOf",
+    value: "", // 双向绑定的值
+    width: "200",
+  },
+  {
+    type: "select",
+    label: "卡类型",
+    field: "simType",
+    options: [], // 默认空，后面会通过字典加载
+    dict: "cardType",
+    value: "", // 双向绑定的值
+    width: "200",
+  },
+  {
+    type: "select",
+    label: "运营商名称",
+    field: "source",
+    options: [], // 默认空，后面会通过字典加载
+    dict: "source",
+    value: "", // 双向绑定的值
+    width: "200",
+  },
+  {
+    type: "date-picker",
+    label: "下单时间",
+    field: "createdAt",
+    value: "", // 双向绑定的值
+    width: "200",
+  },
+  {
+    type: "date-picker",
+    label: "有效期",
+    field: "endData",
+    value: "", // 双向绑定的值
+    width: "200",
+  },
+];

src/views/supplier/trafficList/config.js

@@ -26,4 +26,70 @@ export const columns = [
   // }
 ]
 
+export const SearchFormList = [
+  {
+    type: "select",
+    label: "供应商名称",
+    field: "source",
+    options: [], // 默认空，后面会通过字典加载
+    dict: "source",
+    value: "", // 双向绑定的值
+    width: "200",
+  },
+  {
+    type: "input",
+    label: "流量包名称",
+    field: "userName", 
+    value: "", // 双向绑定的值
+  },
+  {
+    type: "input",
+    label: "地区名称",
+    field: "userName", 
+    value: "", // 双向绑定的值
+  },
+  {
+    type: "input",
+    label: "套餐有效天数",
+    field: "userName", 
+    value: "", // 双向绑定的值
+  },
+  {
+    type: "input",
+    label: "套餐可用流量",
+    field: "userName", 
+    value: "", // 双向绑定的值
+  },
+  {
+    type: "input",
+    label: "默认限速",
+    field: "userName", 
+    value: "", // 双向绑定的值
+  },
+  {
+    type: "input",
+    label: "流量使用地区名称",
+    field: "userName", 
+    value: "", // 双向绑定的值
+  },
+  {
+    type: "input",
+    label: "短信使用地区名称",
+    field: "userName", 
+    value: "", // 双向绑定的值
+  },
+  {
+    type: "input",
+    label: "语音呼出地区名称",
+    field: "userName", 
+    value: "", // 双向绑定的值
+  },
+  {
+    type: "input",
+    label: "语音呼入地区名称",
+    field: "userName", 
+    value: "", // 双向绑定的值
+  }
+]
+
 

src/views/supplier/trafficList/index.vue

@@ -1,43 +1,14 @@
 <!-- 流量包管理 -->
 <template>
   <div class="container">
-    <div class="head-title">
-      <span>{{ route.meta.title }} </span>
-    </div>
     <!-- 搜索条件区 -->
-    <!-- <div class="search-section">
-      <a-form :model="searchForm" ref="formRef" layout="inline">
-        <a-form-item field="status" :label="$t('dataPackage.price')">
-          <a-input v-model="searchForm.price" :placeholder="$t('form.PleaseEnterThe') + $t('dataPackage.price')"
-            allow-clear />
-        </a-form-item>
-        <a-form-item field="periodType" :label="$t('dataPackage.operatorType')">
-          <a-input v-model="searchForm.periodType"
-            :placeholder="$t('form.PleaseEnterThe') + $t('dataPackage.operatorType')" allow-clear />
-        </a-form-item>
-        <a-form-item>
-          <a-space>
-            <a-button type="primary" @click="handleSearch">{{ $t('form.Search') }}</a-button>
-            <a-button @click="resetSearch">{{ $t('form.Reset') }}</a-button>
-          </a-space>
-        </a-form-item>
-      </a-form>
-    </div> -->
-    <!-- <div class="audit-btn">
-      <a-button @click="showNewDataPackageForm" type="text">
-        <template #icon>
-          <icon-plus-circle/>
-        </template>
-<template #default>{{ $t('form.Add') }}</template>
-</a-button>
-</div> -->
+    <div class="search-section">
+      <Search :SearchForm="SearchFormList" @query="intData" @reset="reset"/>
+    </div>
+
 
     <a-table :data="dataSource" :columns="columns" :pagination="pagination" :scroll="{ x: 'auto' }"
       @page-change="evChangePage">
-      <template #id="{ record }">
-        <!-- <a-button type="text" size="small" @click="handleEdit(record)">{{ $t('global.common.edit') }}</a-button>
-        <a-button type="text" size="small" @click="handleDelete(record)">{{ $t('global.common.delete') }}</a-button> -->
-      </template>
     </a-table>
 
   </div>
@@ -46,24 +17,24 @@
 <script setup>
 import { onMounted, ref } from "vue";
 import { useRoute } from "vue-router";
-import { columns } from "./config";
+import { columns,SearchFormList } from "./config";
 import { getDataPlanList } from "@/api/path/lotCard.api"
 import {sanitizeObject} from '@/utils/utils'
-const searchForm = ref({
-  "status": "",
-  "periodType": "",
-});
+import Search from '@/components/Search/index.vue'
+const searchForm = ref({});
 
 
 const dataSource = ref([]);
-const route = useRoute();
 const pagination = ref({
   total: 0,
   pageSize: 10,
   current: 1,
 })
 
-const intData = async () => {
+const intData = async (item) => {
+  if(item){
+    searchForm.value = item
+  }
   const param = {
     current: pagination.value.current,
     size: pagination.value.pageSize,
@@ -82,14 +53,18 @@ const intData = async () => {
   pagination.value.total = data.total
 }
 
+const reset = (item)=>{
+  searchForm.value = item
+  pagination.value.current = 1
+  intData()
+}
+
 
 const evChangePage = (page) => {
   pagination.value.current = page
   intData()
 }
 
-
-
 onMounted(() => {
   intData()
 })

src/views/tariffManagement/Management/add.vue

@@ -8,15 +8,26 @@
                 <a-select v-model="formState.source">
                     <a-option v-for=" item in sourceList" :key="item.id" :value="item.value">{{
                         item.label
-                        }}
+                    }}
                     </a-option>
                 </a-select>
             </a-form-item>
             <template v-if="formState.source">
                 <a-form-item :label="$t('tariffManagement.simDataPlanId')" field="simDataPlanId">
-                    <a-select v-model="formState.simDataPlanId" :disabled="typeIndex !== 1">
+                    <a-select v-model="formState.simDataPlanId" :disabled="typeIndexSet !== 1">
                         <a-option v-for=" (item, index) in planList" :key="item.id" :value="item.id">{{
-                            $t('tariffManagement.DataPackage') }} {{
+                            $t('tariffManagement.simDataPlanId') }} {{
+                                item.productName
+                            }}
+                        </a-option>
+                    </a-select>
+                </a-form-item>
+            </template>
+            <template v-if="formState.source">
+                <a-form-item :label="$t('tariffManagement.TestFlowPacket')" field="testsimDataPlanId">
+                    <a-select v-model="formState.testsimDataPlanId" :disabled="typeIndexSet !== 1">
+                        <a-option v-for=" (item, index) in planList" :key="item.id" :value="item.id">{{
+                            $t('tariffManagement.TestFlowPacket') }} {{
                                 item.productName
                             }}
                         </a-option>
@@ -30,7 +41,7 @@
                 <a-select v-model="formState.userId">
                     <a-option v-for=" item in userIdList" :key="item.id" :value="item.id">{{
                         item.name
-                        }}
+                    }}
                     </a-option>
                 </a-select>
             </a-form-item>
@@ -38,7 +49,7 @@
                 <a-select v-model="formState.billingMethod">
                     <a-option v-for=" item in methodList" :key="item.id" :value="item.value">{{
                         item.label
-                        }}
+                    }}
                     </a-option>
                 </a-select>
             </a-form-item>
@@ -46,7 +57,7 @@
                 <a-select v-model="formState.currency">
                     <a-option v-for=" item in currency" :key="item.id" :value="item.value">{{
                         item.label
-                        }}
+                    }}
                     </a-option>
                 </a-select>
             </a-form-item>
@@ -92,7 +103,7 @@
             <a-form-item>
                 <a-button type="primary" html-type="submit" style="margin-right: 10px;">{{
                     $t('form.Confirm')
-                    }}
+                }}
                 </a-button>
                 <a-button @click="resetForm">{{ $t('form.Cancel') }}</a-button>
             </a-form-item>
@@ -125,7 +136,7 @@ const props = defineProps({
 })
 
 const modelValue = toRef(props, 'modelValue')
-const typeIndex = toRef(props, 'typeIndex')
+const typeIndexSet = ref(null)
 const FormDataList = toRef(props, 'FormDataList')
 const emit = defineEmits(['update:modelValue', 'submit'])
 
@@ -157,7 +168,8 @@ const state = ref({
         "mrcAmount": '',
         // 网络接入费
         "networkAccessFee": '',
-        "endDate": ''
+        "endDate": '',
+        "testsimDataPlanId": null
     },
     sourceList: [],
     userIdList: [],
@@ -185,6 +197,7 @@ const rules = {
     mrcAmount: [{ required: true, trigger: 'change', }],
     networkAccessFee: [{ required: true, trigger: 'change', }],
     endDate: [{ required: true, trigger: 'change', }],
+    testsimDataPlanId: [{ required: true, trigger: 'change', }],
 };
 
 
@@ -299,8 +312,12 @@ watch(() => FormDataList.value, val => {
         }
     })
     formState.value.id = val.id
+}, { immediate: true })
+
 
-    console.log(val);
+watch(() => props.typeIndex, val => {
+    if (val == null) return
+    typeIndexSet.value = val
 }, { immediate: true })
 
 onMounted(() => {

src/views/tariffManagement/config.js

@@ -1,63 +1,274 @@
 export let columns = [
-    { title: window.$t('tariffManagement.id'), dataIndex: 'Number', align: 'center', width: 200, ellipsis: true },
-    // { title: window.$t('tariffManagement.feeCode'), dataIndex: 'feeCode', align: 'center', width: 200 },
-    { title: window.$t('tariffManagement.userName'), dataIndex: 'userName', align: 'center', width: 200, ellipsis: true },
-    { title: window.$t('tariffManagement.label'), dataIndex: 'label', align: 'center', width: 200, ellipsis: true },
-    { title: window.$t('tariffManagement.source'), dataIndex: 'sourceName', align: 'center', width: 200, ellipsis: true },
-    // { title: window.$t('tariffManagement.trafficType'), dataIndex: 'trafficTypeName', align: 'center', width: 200 },
-    // { title: window.$t('tariffManagement.billingType'), dataIndex: 'billingTypeName', align: 'center', width: 200 },
-    { title: window.$t('tariffManagement.billingCycle'), dataIndex: 'billingCycleName', align: 'center', width: 200, ellipsis: true },
-    { title: window.$t('tariffManagement.BillingMode'), dataIndex: 'billingMethodName', align: 'center', width: 200, ellipsis: true },
-    // { title: window.$t('tariffManagement.bagSize'), dataIndex: 'bagSize', align: 'center', width: 200 },
-    { title: window.$t('tariffManagement.pricing'), dataIndex: 'pricingName', align: 'center', width: 200, ellipsis: true },
-    // { title: window.$t('tariffManagement.billingMethod'), dataIndex: 'billing_method', align: 'center', width: 200 },
-    { title: window.$t('tariffManagement.ActivatedNames'), dataIndex: 'Activated', align: 'center', width: 200, ellipsis: true },
-    { title: window.$t('tariffManagement.feeStatus'), dataIndex: 'status', align: 'center', width: 200, ellipsis: true },
-    { title: window.$t('tariffManagement.MRCName'), dataIndex: 'mrcAmount', align: 'center', width: 200, ellipsis: true },
-    { title: window.$t('tariffManagement.networkName'), dataIndex: 'networkAccessFee', align: 'center', width: 200, ellipsis: true },
-    { title: window.$t('tariffManagement.endDate'), dataIndex: 'endDate', align: 'center', width: 200, ellipsis: true },
-    {
-        title: window.$t('global.common.operations'),
-        dataIndex: 'id',
-        slotName: 'id',
-        align: 'center',
-        width: 180,
-        fixed: "right",
-    }
-]
+  {
+    title: window.$t("tariffManagement.id"),
+    dataIndex: "Number",
+    align: "center",
+    width: 200,
+    ellipsis: true,
+  },
+  // { title: window.$t('tariffManagement.feeCode'), dataIndex: 'feeCode', align: 'center', width: 200 },
+  {
+    title: window.$t("tariffManagement.userName"),
+    dataIndex: "userName",
+    align: "center",
+    width: 200,
+    ellipsis: true,
+  },
+  {
+    title: window.$t("tariffManagement.label"),
+    dataIndex: "label",
+    align: "center",
+    width: 200,
+    ellipsis: true,
+  },
+  {
+    title: window.$t("tariffManagement.source"),
+    dataIndex: "sourceName",
+    align: "center",
+    width: 200,
+    ellipsis: true,
+  },
+  {
+    title: window.$t("tariffManagement.simDataPlanIdName"),
+    dataIndex: "metadataPackagesName",
+    align: "center",
+    width: 200,
+    ellipsis: true,
+  },
+  {
+    title: window.$t("tariffManagement.TestFlowPacketName"),
+    dataIndex: "testMetadataPackagesName",
+    align: "center",
+    width: 200,
+    ellipsis: true,
+  },
+  // { title: window.$t('tariffManagement.trafficType'), dataIndex: 'trafficTypeName', align: 'center', width: 200 },
+  // { title: window.$t('tariffManagement.billingType'), dataIndex: 'billingTypeName', align: 'center', width: 200 },
+  {
+    title: window.$t("tariffManagement.billingCycle"),
+    dataIndex: "billingCycleName",
+    align: "center",
+    width: 200,
+    ellipsis: true,
+  },
+  {
+    title: window.$t("tariffManagement.BillingMode"),
+    dataIndex: "billingMethodName",
+    align: "center",
+    width: 200,
+    ellipsis: true,
+  },
+  // { title: window.$t('tariffManagement.bagSize'), dataIndex: 'bagSize', align: 'center', width: 200 },
+  {
+    title: window.$t("tariffManagement.pricing"),
+    dataIndex: "pricingName",
+    align: "center",
+    width: 200,
+    ellipsis: true,
+  },
+  // { title: window.$t('tariffManagement.billingMethod'), dataIndex: 'billing_method', align: 'center', width: 200 },
+  {
+    title: window.$t("tariffManagement.ActivatedNames"),
+    dataIndex: "Activated",
+    align: "center",
+    width: 200,
+    ellipsis: true,
+  },
+  {
+    title: window.$t("tariffManagement.feeStatus"),
+    dataIndex: "status",
+    align: "center",
+    width: 200,
+    ellipsis: true,
+  },
+  {
+    title: window.$t("tariffManagement.MRCName"),
+    dataIndex: "mrcAmount",
+    align: "center",
+    width: 200,
+    ellipsis: true,
+  },
+  {
+    title: window.$t("tariffManagement.networkName"),
+    dataIndex: "networkAccessFee",
+    align: "center",
+    width: 200,
+    ellipsis: true,
+  },
+  {
+    title: window.$t("tariffManagement.endDate"),
+    dataIndex: "endDate",
+    align: "center",
+    width: 200,
+    ellipsis: true,
+  },
+  {
+    title: window.$t("global.common.operations"),
+    dataIndex: "id",
+    slotName: "id",
+    align: "center",
+    width: 180,
+    fixed: "right",
+  },
+];
+// 资费套餐
+export const planColumns = [
+  {
+    title: window.$t("tariffManagement.feeCode"),
+    dataIndex: "feeCode",
+    align: "center",
+    width: 200,
+  },
+  {
+    title: window.$t("tariffManagement.label"),
+    dataIndex: "label",
+    align: "center",
+    width: 200,
+  },
+  {
+    title: window.$t("tariffManagement.source"),
+    dataIndex: "sourceName",
+    align: "center",
+    width: 200,
+  },
+  {
+    title: window.$t("tariffManagement.bagSize"),
+    dataIndex: "bag_size",
+    align: "center",
+    width: 200,
+  },
+];
 
-// export const columnsCustomer = [
-//     { title: window.$t('tariffManagement.id'), dataIndex: 'id', align: 'center', width: 200, ellipsis: true },
-//     // { title: window.$t('tariffManagement.feeCode'), dataIndex: 'feeCode', align: 'center', width: 200 },
-//     { title: window.$t('tariffManagement.userName'), dataIndex: 'userName', align: 'center', width: 200, ellipsis: true },
-//     { title: window.$t('tariffManagement.label'), dataIndex: 'label', align: 'center', width: 200, ellipsis: true },
-//     { title: window.$t('tariffManagement.source'), dataIndex: 'sourceName', align: 'center', width: 200, ellipsis: true },
-//     // { title: window.$t('tariffManagement.trafficType'), dataIndex: 'trafficTypeName', align: 'center', width: 200 },
-//     // { title: window.$t('tariffManagement.billingType'), dataIndex: 'billingTypeName', align: 'center', width: 200 },
-//     { title: window.$t('tariffManagement.billingCycle'), dataIndex: 'billingCycleName', align: 'center', width: 200, ellipsis: true },
-//     // { title: window.$t('tariffManagement.bagSize'), dataIndex: 'bagSize', align: 'center', width: 200 },
-//     { title: '结算周期', dataIndex: 'billingCycleName', align: 'center', width: 200 },
-//     { title: '流量资费价格', dataIndex: 'bagSize', align: 'center', width: 200 },
-//     { title: '充值定价', dataIndex: '', align: 'center', width: 200 },
-//     { title: window.$t('tariffManagement.pricing'), dataIndex: 'pricingName', align: 'center', width: 200, ellipsis: true },
-//     // { title: window.$t('tariffManagement.billingMethod'), dataIndex: 'billing_method', align: 'center', width: 200 },
-//     { title: window.$t('tariffManagement.settlementCycleLabel'), dataIndex: 'settlementCycle', align: 'center', width: 200, ellipsis: true },
-//     { title: window.$t('tariffManagement.ActivatedNames'), dataIndex: 'Activated', align: 'center', width: 200, ellipsis: true },
-//     { title: window.$t('tariffManagement.feeStatus'), dataIndex: 'status', align: 'center', width: 200, ellipsis: true },
-//     {
-//         title: window.$t('global.common.operations'),
-//         dataIndex: 'id',
-//         slotName: 'id',
-//         align: 'center',
-//         width: 180,
-//         fixed: "right",
-//     }
-// ]
+// 资费搜索字段
+export const trafficSearchFrom = [
+  {
+    type: "input",
+    label: "客户名称",
+    field: "username",
+    value: "", // 双向绑定的值
+  },
+  {
+    type: "input",
+    label: "资费名称",
+    field: "label",
+    value: "", // 双向绑定的值
+  },
+  {
+    type: "select",
+    label: "供应商名称",
+    field: "source",
+    options: [], // 默认空，后面会通过字典加载
+    dict: "source",
+    value: "", // 双向绑定的值
+    width: "200",
+  },
+  {
+    type: "select",
+    label: "计费方式",
+    field: "billingMethod",
+    options: [], // 默认空，后面会通过字典加载
+    dict: "billingMethod",
+    value: "", // 双向绑定的值
+    width: "200",
+  },
+  {
+    type: "select",
+    label: "计费周期",
+    field: "BillingCycle",
+    options: [], // 默认空，后面会通过字典加载
+    dict: "BillingCycle",
+    value: "", // 双向绑定的值
+    width: "200",
+  },
+  {
+    type: "date-picker",
+    label: "有效期",
+    field: "endDate",
+    value: "", // 双向绑定的值
+    width: "200",
+  },
+];
 
+// 客户搜索字段
+export const UserSearchForm = [
+  {
+    type: "input",
+    label: "客户名称",
+    field: "name",
+    value: "", // 双向绑定的值
+  },
+  {
+    type: "input",
+    label: "客户账号",
+    field: "username",
+    value: "", // 双向绑定的值
+  },
+  {
+    type: "select",
+    label: "客户状态",
+    field: "state",
+    options: [], // 默认空，后面会通过字典加载
+    dict: "userType",
+    value: "", // 双向绑定的值
+    width: "200",
+  },
+  {
+    type: "range-picker",
+    label: "创建时间",
+    field: "createdAt",
+    value: [], // 双向绑定的值
+    width: "300",
+    Custom: 'mode="month"', // 自定义值
+  },
+];
 
-export const planColumns = [
-    { title: window.$t('tariffManagement.feeCode'), dataIndex: 'feeCode', align: 'center', width: 200 },
-    { title: window.$t('tariffManagement.label'), dataIndex: 'label', align: 'center', width: 200 },
-    { title: window.$t('tariffManagement.source'), dataIndex: 'sourceName', align: 'center', width: 200 },
-    { title: window.$t('tariffManagement.bagSize'), dataIndex: 'bag_size', align: 'center', width: 200 },
-]
+export const UserColumns = [
+  {
+    title: window.$t("customer.id"),
+    dataIndex: "id",
+    align: "center",
+    ellipsis: true,
+  },
+  {
+    title: window.$t("customer.customerName"),
+    dataIndex: "name",
+    align: "center",
+    ellipsis: true,
+  },
+  {
+    title: window.$t("customer.userAdmin"),
+    dataIndex: "username",
+    align: "center",
+  },
+  {
+    title: window.$t("customer.customerStatus"),
+    slotName: "state",
+    align: "center",
+    ellipsis: true,
+  },
+  { title: "app_key  ", dataIndex: "appKey", align: "center", ellipsis: true },
+  {
+    title: "app_secret",
+    dataIndex: "appSecret",
+    align: "center",
+    ellipsis: true,
+  },
+  {
+    title: window.$t("customer.startTime"),
+    dataIndex: "createdAt",
+    align: "center",
+    ellipsis: true,
+  },
+  {
+    title: window.$t("customer.updateTime"),
+    dataIndex: "updatedAt",
+    align: "center",
+    ellipsis: true,
+  },
+  {
+    title: window.$t("global.common.operations"),
+    slotName: "operation",
+    align: "center",
+    ellipsis: true,
+  },
+];

src/views/tariffManagement/customer/NewCustomerForm.vue

@@ -68,10 +68,9 @@
           <!-- Status -->
           <a-form-item field="state" :label="$t('customer.statusName')" required validate-trigger="blur">
             <a-radio-group v-model="formData.state">
-              <a-radio value="1">{{ $t('customer.status.normal') }}</a-radio>
-              <a-radio value="2">{{ $t('customer.status.disabled') }}</a-radio>
-              <a-radio value="3">{{ $t('customer.status.pending') }}</a-radio>
-              <a-radio value="4">{{ $t('customer.status.suspended') }}</a-radio>
+              <a-radio :value="item.value" v-for="item in userTypes">{{
+                item.value == 1 ? $t('customer.status.normal') : (item.value == 2 ? $t('customer.status.disabled') : (item.value == 3 ? $t('customer.status.pending') : $t('customer.status.suspended')))
+                }}</a-radio>
             </a-radio-group>
           </a-form-item>
         </a-form>
@@ -221,7 +220,7 @@ import { dictionaryDetail } from '@/api/path/dict.js'
 import Upload from "@/components/upload/index.vue";
 import { systemFindRoleList } from "@/api/path/system.api.js";
 import { addCustomer, updateCustomer } from "@/api/customer.js";
-
+import { Getdictionary } from '@/mixins/index.js'
 const { t } = useI18n();
 import { encryptByDES } from '@/utils/crypto.js'
 
@@ -234,6 +233,7 @@ const props = defineProps({
 
 const invoiceList = ref([])
 const roles = ref([])
+const userTypes = ref([])
 watch(
   () => props.editData,
   (newVal) => {
@@ -404,6 +404,11 @@ const getRolesData = async () => {
   }
 }
 
+const getList = async () => {
+  let res = await Getdictionary('userType')
+  userTypes.value = res.data
+}
+
 watch(() => props.visible, val => {
   if (!val) {
     Object.keys(formData.value).forEach(key => {
@@ -412,8 +417,9 @@ watch(() => props.visible, val => {
   } else {
     getRolesData()
     getDistList()
+    getList()
   }
-},{immediate:true})
+}, { immediate: true })
 
 </script>
 

src/views/tariffManagement/customer/index.vue

@@ -3,56 +3,26 @@
   <div class="customer-management">
     <!-- 搜索条件区 -->
     <div class="search-section">
-      <a-form :model="searchForm" layout="inline">
-        <a-form-item field="customerName" :label="$t('customer.customerName')">
-          <a-input v-model="searchForm.customerName" :placeholder="$t('customer.enterCustomerName')" allow-clear />
-        </a-form-item>
-        <a-form-item field="operatorType" :label="$t('customer.operatorType')">
-          <a-select v-model="searchForm.operatorType" :placeholder="$t('customer.selectOperatorType')" allow-clear
-            style="width: 160px">
-            <a-option v-for="op in operatorTypeOptions" :key="op.value" :value="op.value">
-              {{ $t(`customer.operatorTypes.${op.value}`) }}
-            </a-option>
-          </a-select>
-        </a-form-item>
-        <a-form-item>
-          <a-button type="primary" @click="handleSearch">{{ $t('global.common.search') }}</a-button>
-        </a-form-item>
-        <a-form-item>
-          <a-button @click="resetSearch">{{ $t('global.common.reset') }}</a-button>
-        </a-form-item>
-      </a-form>
+      <Search :SearchForm="UserSearchForm" @query="fetchCustomerList"/>
     </div>
 
     <!-- 顶部操作区 -->
     <div class="top-actions">
       <a-space>
         <a-button type="primary" @click="showNewCustomerForm">{{ $t('customer.addCustomer') }}</a-button>
-        <!-- <a-button @click="handleBatchDelete">{{ $t('customer.batchDelete') }}</a-button> -->
       </a-space>
     </div>
 
     <!-- 数据表格 -->
-    <a-table row-key="id" :columns="columns" :data="tableData" :pagination="pagination" :scroll="{ x: 'auto' }"
+    <a-table row-key="id" :columns="UserColumns" :data="tableData" :pagination="pagination" :scroll="{ x: 'auto' }"
       :row-selection="{ type: 'checkbox', showCheckedAll: true }" @page-change="onPageChange">
       <template #state="{ record }">
         <a-tag :color="getStatusColor(record.state)">
           {{ $t(`customer.status.${getStatusText(record.state)}`) }}
         </a-tag>
       </template>
-      <template #user_type="{ record }">
-        {{ $t(`customer.${getUserType(record.user_type)}`) }}
-      </template>
       <template #operation="{ record }">
         <a-space>
-          <!--          <a-button type="text" size="small" @click="handleRecharge(record)">{{-->
-          <!--              $t('customer.recharge')-->
-          <!--            }}-->
-          <!--          </a-button>-->
-          <!--          <a-button type="text" size="small" @click="handlePackageManagement(record)">{{-->
-          <!--              $t('customer.packageManagement')-->
-          <!--            }}-->
-          <!--          </a-button>-->
           <a-button type="text" size="small" @click="handleEdit(record)">{{
             $t('global.common.edit')
           }}
@@ -73,24 +43,12 @@ import { Message } from '@arco-design/web-vue';
 import { useI18n } from 'vue-i18n';
 import NewCustomerForm from './NewCustomerForm.vue';
 import { getMessUserList, deleteMessUser } from '@/api/customer.js';
-
+import {UserSearchForm,UserColumns} from '../config'
+import Search from '@/components/Search/index.vue'
 const { t } = useI18n();
 
 const loading = ref(false);
 
-const columns = computed(() => [
-  { title: t('customer.id'), dataIndex: 'id', align: 'center', ellipsis: true },
-  { title: t('customer.customerName'), dataIndex: 'name', align: 'center', ellipsis: true },
-  { title: t('customer.userAdmin'), dataIndex: 'username', align: 'center' },
-  { title: t('customer.customerStatus'), slotName: 'state', align: 'center', ellipsis: true },
-  { title: 'app_key  ', dataIndex: 'appKey', align: 'center', ellipsis: true },
-  { title: 'app_secret', dataIndex: 'appSecret', align: 'center', ellipsis: true },
-  { title: t('customer.userTypeName'), align: 'center', dataIndex: 'userType', ellipsis: true },
-  { title: t('customer.startTime'), dataIndex: 'createdAt', align: 'center', ellipsis: true },
-  { title: t('customer.updateTime'), dataIndex: 'updatedAt', align: 'center', ellipsis: true },
-  { title: t('global.common.operations'), slotName: 'operation', align: 'center', ellipsis: true },
-]);
-
 onMounted(() => {
   fetchCustomerList();
 });
@@ -102,26 +60,16 @@ const pagination = reactive({
   current: 1,
   pageSize: 10,
 });
-const fetchCustomerList = async () => {
-  try {
+const fetchCustomerList = async (item) => {
     const response = await getMessUserList({
       current: pagination.current,
       pageSize: pagination.pageSize,
-      customerName: searchForm.customerName,
-      operatorType: searchForm.operatorType,
+      ...item
     });
     if (response.code === 200 && response.data) {
-      tableData.value = response.data.records.map(res => ({ ...res, userType: res.userType == 1 ? '平台' : '客户' }))
+      tableData.value = response.data.records
       pagination.total = response.data.total;
-      pagination.current = response.data.current;
-      pagination.pageSize = response.data.size;
-    } else {
-      Message.error(response.message || 'Failed to fetch customer list');
     }
-  } catch (error) {
-    Message.error('Failed to fetch customer list');
-    console.error(error);
-  }
 };
 
 const onPageChange = (page) => {
@@ -133,15 +81,6 @@ const newCustomerFormVisible = ref(false);
 const editMode = ref(false);
 const editData = ref(null);
 
-const searchForm = reactive({
-  customerName: '',
-  operatorType: '',
-});
-
-const operatorTypeOptions = [
-  { value: 'domestic', label: t('customer.operatorTypes.domestic') },
-  { value: 'international', label: t('customer.operatorTypes.international') },
-];
 
 const showNewCustomerForm = () => {
   editMode.value = false;
@@ -177,18 +116,6 @@ const handleNewCustomerSubmit = (formData) => {
   }
 };
 
-const handleSearch = () => {
-  pagination.current = 1;
-  fetchCustomerList();
-};
-
-const resetSearch = () => {
-  Object.keys(searchForm).forEach(key => {
-    searchForm[key] = '';
-  });
-  pagination.current = 1;
-  fetchCustomerList();
-};
 
 const getStatusColor = (state) => {
   const stateColors = {
@@ -200,14 +127,6 @@ const getStatusColor = (state) => {
   return stateColors[state] || 'default';
 };
 
-const getUserType = (state) => {
-  const stateType = {
-    '1': 'platform',
-    '2': 'client'
-  }
-  return stateType[state] || 'undefined';
-}
-
 const getStatusText = (state) => {
   const stateTexts = {
     '1': 'normal',     // 正常

src/views/tariffManagement/index.vue

@@ -1,15 +1,9 @@
 <!-- 资费管理 -->
 <template>
   <div class="container">
-    <div class="head-title">
-      <span>{{ route.meta.title }} </span>
-      <span class="head-title-right">
-        <!-- <a-button class="m-r-10" type="primary" @click="dictShowModel(1, null)">{{ $t('form.Add') }}</a-button> -->
-      </span>
-    </div>
     <!-- 搜索条件区 -->
     <div class="search-section">
-      <Search :SearchForm="SearchForm" />
+      <Search :SearchForm="trafficSearchFrom" @query="intData" @reset="reset"/>
     </div>
     <div class="audit-btn">
       <a-button type="text" @click="dictShowModel(1, null)" v-if="role.getRole == 1">
@@ -73,7 +67,7 @@
 <script setup>
 import { onMounted, ref, toRefs, getCurrentInstance } from "vue";
 import { useRoute } from "vue-router";
-import { columns, planColumns } from "./config";
+import { columns, planColumns ,trafficSearchFrom} from "./config";
 import { deleteTariff, tariffList } from "@/api/path/tariffManagement.api"
 import { Getdictionary } from '@/mixins/index.js'
 import { useSystemStore } from '@/store/modules/systemStore'
@@ -86,34 +80,8 @@ const { t } = useI18n();
 const role = useSystemStore()
 const { proxy } = getCurrentInstance()
 const route = useRoute();
-const SearchForm = [
-  {
-    type: 'input',
-    label: '资费名称',
-    field: 'source',
-    placeholder: '请输入资费名称',
-    value: '', // 双向绑定的值
-  },
-  {
-    type: 'input',
-    label: '客户名称',
-    field: 'trafficId',
-    placeholder: '请输入客户名称',
-    value: '', // 双向绑定的值
-  },
-  {
-    type: 'select',
-    label: '供应商名称',
-    field: 'simType',
-    placeholder: '请选择供应商名称',
-    options: [], // 默认空，后面会通过字典加载
-    value: '', // 双向绑定的值
-    dict: 'source', // 字典加载的标识
-    width: '200'
-  },
-]
 const state = ref({
-  searchForm: { "label": "", },
+  searchForm: {},
   FormDataList: {},
   currency: [],
   dataSource: [],
@@ -159,7 +127,10 @@ const {
   methodList
 } = toRefs(state.value);
 
-const intData = async () => {
+const intData = async (item) => {
+  if(item){
+    searchForm.value = item
+  }
   const param = {
     current: pagination.value.current,
     size: pagination.value.pageSize,
@@ -196,6 +167,12 @@ const intData = async () => {
   pagination.value.total = data.total
 }
 
+const reset = (item)=>{
+  searchForm.value = item 
+  pagination.value.current = 1
+  intData()
+}
+
 
 // 删除
 const handleDel = async (id) => {

vite.config.js

@@ -62,7 +62,6 @@ export default defineConfig({
         proxy: {
             "/api": {
                 // target: "http://sim.nanodreamtech.com",
-                // target:"http://192.168.0.78:3001",// 果本地端口
                 // target: "http://127.0.0.1:3001",
                 target: "http://sim.ainets.net",
                 changeOrigin: true,