分模块 修改字段 资费添加套餐字段

src/api/customer.js

@@ -1,4 +1,4 @@
-import service from './axios'
+import service from '../utils/axios'
 
 export function getCustomerList(data) {
     return service({

src/api/finance.js

@@ -1,4 +1,4 @@
-import service from './axios'
+import service from '../utils/axios'
 
 // 查询充值记录
 export function getTopUpRecordList(data) {

src/api/path/component.api.js

@@ -1,5 +1,5 @@
 
-import service from '../axios'
+import service from '../../utils/axios'
 
 // 保存物料
 export function componentSave(param) {

src/api/path/dict.js

@@ -1,4 +1,4 @@
-import service from '../axios'
+import service from '../../utils/axios'
 
 // 字典列表
 export function dictionaryList(param) {

src/api/path/dictionary.js

@@ -1,4 +1,4 @@
-import service from '../axios'
+import service from '../../utils/axios'
 
 // 获取字典列表
 export function getDictionaryList(param) {

src/api/path/flowPool.api.js

@@ -1,5 +1,5 @@
 
-import service from '../axios'
+import service from '../../utils/axios'
 
 // 分销商
 // 新增

src/api/path/login.api.js

@@ -1,5 +1,5 @@
 
-import service from '../axios'
+import service from '../../utils/axios'
 
 // * 登录
 export function loginApi(data) {

src/api/path/lotCard.api.js

@@ -1,4 +1,4 @@
-import service from "../axios";
+import service from "../../utils/axios";
 
 
 // ----------------------------流量管理---------------------------------

src/api/path/order.js

@@ -1,4 +1,4 @@
-import service from "../axios";
+import service from "../../utils/axios";
 
 // 订单审核
 export function OrderCardStatus(data){

src/api/path/purchase.js

@@ -1,4 +1,4 @@
-import service from '../axios'
+import service from '../../utils/axios'
 
 // 采购订单分页查询
 export function purchaseOrderList(param) {

src/api/path/star.api.js

@@ -1,5 +1,5 @@
 
-import service from '../axios'
+import service from '../../utils/axios'
 
 // 分销商
 // 新增

src/api/path/system.api.js

@@ -1,5 +1,5 @@
 
-import service from '../axios'
+import service from '../../utils/axios'
 
 // 获取菜单
 

src/api/path/tariffManagement.api.js

@@ -1,5 +1,5 @@
 
-import service from '../axios'
+import service from '../../utils/axios'
 
 // 查询资费计划
 export function tariffList(param) {

src/api/axios.js → src/utils/axios.js

@@ -5,7 +5,6 @@ import { useSystemStore } from "@/store/modules/systemStore";
 
 import { fn_logout } from "@/utils";
 
-console.log(import.meta.env.BASE_URL)
 const axiosInstance = axios.create({
   // baseURL: `${import.meta.env.PROD ? import.meta.env.VITE_PRO_PATH : ''}/api`,
   baseURL: import.meta.env.BASE_URL + "api",

src/utils/cache.js

@@ -0,0 +1,85 @@
+// localStorage.js
+const Storage = {
+    // 设置缓存
+    set(key, value) {
+      if (key && value !== undefined) {
+        // 如果 value 是对象或数组，转成 JSON 字符串
+        if (typeof value === 'object') {
+          value = JSON.stringify(value);
+        }
+        localStorage.setItem(key, value);
+      } else {
+        console.warn("Invalid key or value");
+      }
+    },
+  
+    // 获取缓存
+    get(key) {
+      if (key) {
+        const value = localStorage.getItem(key);
+        if (value) {
+          try {
+            // 尝试解析 JSON 格式的数据
+            return JSON.parse(value);
+          } catch (e) {
+            // 如果解析失败，直接返回原始字符串
+            return value;
+          }
+        }
+        return null; // 如果没有找到缓存项
+      }
+      return null;
+    },
+  
+    // 删除缓存
+    remove(key) {
+      if (key) {
+        localStorage.removeItem(key);
+      }
+    },
+  
+    // 清空所有缓存
+    clear() {
+      localStorage.clear();
+    },
+  
+    // 判断缓存是否存在
+    exists(key) {
+      return localStorage.getItem(key) !== null;
+    },
+  
+    // 获取缓存的所有键
+    getAllKeys() {
+      return Object.keys(localStorage);
+    },
+  
+    // 设置过期时间，单位：秒
+    setWithExpire(key, value, expireTimeInSec) {
+      if (expireTimeInSec && expireTimeInSec > 0) {
+        const expireDate = new Date().getTime() + expireTimeInSec * 1000;
+        const data = {
+          value: value,
+          expireDate: expireDate,
+        };
+        this.set(key, data);
+      } else {
+        console.warn("Invalid expire time");
+      }
+    },
+  
+    // 获取带过期时间的缓存
+    getWithExpire(key) {
+      const data = this.get(key);
+      if (data && data.expireDate && new Date().getTime() < data.expireDate) {
+        return data.value;
+      } else {
+        // 如果缓存过期或数据不存在，则返回 null
+        this.remove(key);
+        return null;
+      }
+    },
+  };
+  
+  // 导出 Storage 对象
+  export default Storage;
+  

src/views/flowPool/forewarning.vue → src/views/flowPool/components/forewarning.vue

@@ -3,7 +3,6 @@ import { ref, onMounted, toRefs, toRef, watch, watchEffect } from 'vue';
 import { Message } from "@arco-design/web-vue";
 import { Getdictionary } from '@/mixins/index.js'
 import { createWarning, updateWarning } from '@/api/path/flowPool.api.js'
-import { value } from "lodash/seq.js";
 
 const props = defineProps({
   modelValue: {

src/views/flowPool/components/openExport.vue

@@ -0,0 +1,189 @@
+<template>
+    <a-modal v-model:visible="modelValue" @ok="handleOk" @cancel="handleCancel" width="1000px">
+        <template #title>
+            批量导入
+        </template>
+        <div class="export-box">
+            <div class="export-box-item">
+                <div class="box-item-title">
+                    <div class="title-icon"></div>
+                    批量导入
+                </div>
+                <div class="box-item-content">
+                    <a-form :model="searchForm">
+                        <a-form-item field="label" :label="$t('flowPool.label')">
+                            <a-input v-model="searchForm.label"
+                                :placeholder="$t('lotCard.please') + $t('flowPool.label')" allow-clear />
+                        </a-form-item>
+                        <a-form-item field="label" :label="$t('flowPool.status')">
+                            <a-select v-model="value" :style="{ width: '240px' }"
+                                :placeholder="$t('flowPool.flowPoolStatus')">
+                                <a-option v-for="item of trafficList" :value="item.id" :label="item.label" />
+                            </a-select>
+                        </a-form-item>
+                        <a-form-item field="label" :label="$t('flowPool.operator')">
+                            <a-select v-model="value" :style="{ width: '240px' }"
+                                :placeholder="$t('flowPool.operatorName')">
+                                <a-option v-for="item of sourceList" :value="item.id" :label="item.label" />
+                            </a-select>
+                        </a-form-item>
+                        <a-form-item field="label" :label="$t('flowPool.start_time')">
+                            <a-date-picker style="width: 200px;" :placeholder="$t('flowPool.start_timeName')" />
+                        </a-form-item>
+                    </a-form>
+                </div>
+            </div>
+            <div class="export-box-item" style="margin-top:20px;">
+                <div class="box-item-title">
+                    <div class="title-icon"></div>
+                    导入结果
+                </div>
+                <div class="box-item-content">
+                    <a-table :columns="columnsExport" :data="dataExport" :pagination="paginationCard"
+                        :scroll="{ x: 'auto' }" @page-change="evChangePageCard">
+                        <template #operate="{ record }">
+                            <a-button @click="openContract(record)" type="text">下载</a-button>
+                        </template>
+                        <template #status="{ record }">
+                            <div class="export-status" v-if="record.status == 1">
+                                <div class="status-icon" style="background: rgba(82, 196, 27, 1);"></div>
+                                导入成功
+                            </div>
+                            <div class="export-status" v-if="record.status == 2">
+                                <div class="status-icon" style="background: rgba(250, 173, 20, 1);"></div>
+                                部分成功
+                            </div>
+                            <div class="export-status" v-if="record.status == 3">
+                                <div class="status-icon" style="background: rgba(247, 66, 75, 1);"></div>
+                                校验失败
+                            </div>
+                        </template>
+                    </a-table>
+                </div>
+            </div>
+        </div>
+    </a-modal>
+</template>
+
+<script setup>
+import { ref, onMounted, toRefs, toRef, watch } from 'vue';
+const props = defineProps({
+    modelValue: {
+        type: Boolean,
+        default: false
+    },
+})
+
+const modelValue = toRef(props, 'modelValue')
+const emit = defineEmits(['update:modelValue', 'submit'])
+
+const columnsExport = [
+    { title: '序号', dataIndex: 'index', align: 'center', render: ({ rowIndex }) => rowIndex + 1 },
+    {
+        title: '操作人',
+        dataIndex: 'name',
+    },
+    {
+        title: '导入时间',
+        dataIndex: 'exportTime',
+    },
+    {
+        title: '完成时间',
+        dataIndex: 'successTime',
+    },
+    {
+        title: '状态',
+        slotName: 'status',
+        align: 'center'
+    },
+    { title: '操作', slotName: 'operate', align: 'center' },
+];
+
+const state = ref({
+    dataExport: [],
+    paginationCard: {
+        total: 0,
+        pageSize: 10,
+        current: 1,
+    },
+    searchForm: {
+        "label": "",
+        "trafficPoolType": "1"
+    }
+})
+
+const { dataExport, paginationCard,searchForm } = toRefs(state.value)
+
+
+// 卡信息
+const evChangePageCard = (page) => {
+    paginationCard.value.current = page
+    intData()
+}
+</script>
+<style scoped lang="less">
+.export-box {
+  .export-box-item {
+    .box-item-title {
+      display: flex;
+      align-items: center;
+      font-family: PingFang SC;
+      font-size: 16px;
+      font-weight: 600;
+      line-height: 24px;
+      color: rgba(0, 0, 0, 0.85);
+      margin-bottom: 10px;
+
+      .title-icon {
+        margin-right: 10px;
+        width: 4px;
+        height: 16px;
+        background: #1B5DF8;
+
+      }
+    }
+
+    .box-item-content {
+      .item-txt {
+        display: flex;
+        align-items: center;
+        margin-bottom: 10px;
+
+        .item-txt-title {
+          width: 300px;
+          text-align: right;
+          margin-right: 10px;
+        }
+
+        .item-txt-text {
+          font-family: PingFang SC;
+          font-size: 14px;
+          font-weight: 400;
+          line-height: 22px;
+          text-align: left;
+          color: #1B5DF8;
+
+        }
+      }
+
+      .export-status {
+        font-family: PingFang SC;
+        font-size: 14px;
+        font-weight: 400;
+        line-height: 22px;
+        text-align: left;
+        color: rgba(51, 51, 51, 1);
+        display: flex;
+        align-items: center;
+
+        .status-icon {
+          width: 6px;
+          height: 6px;
+          border-radius: 50%;
+          margin-right: 10px;
+        }
+      }
+    }
+  }
+}
+</style>

src/views/flowPool/index.vue

@@ -5,21 +5,20 @@
     <div class="search-section">
       <a-form :model="searchForm" layout="inline">
         <a-form-item field="label" :label="$t('flowPool.label')">
-          <a-input v-model="searchForm.label" :placeholder="$t('lotCard.please') + $t('flowPool.label')"
-                   allow-clear/>
+          <a-input v-model="searchForm.label" :placeholder="$t('lotCard.please') + $t('flowPool.label')" allow-clear />
         </a-form-item>
         <a-form-item field="label" :label="$t('flowPool.status')">
-          <a-select v-model="value" :style="{width:'240px'}" :placeholder="$t('flowPool.flowPoolStatus')">
-            <a-option v-for="item of trafficList" :value="item.id" :label="item.label"/>
+          <a-select v-model="value" :style="{ width: '240px' }" :placeholder="$t('flowPool.flowPoolStatus')">
+            <a-option v-for="item of trafficList" :value="item.id" :label="item.label" />
           </a-select>
         </a-form-item>
         <a-form-item field="label" :label="$t('flowPool.operator')">
-          <a-select v-model="value" :style="{width:'240px'}" :placeholder="$t('flowPool.operatorName')">
-            <a-option v-for="item of sourceList" :value="item.id" :label="item.label"/>
+          <a-select v-model="value" :style="{ width: '240px' }" :placeholder="$t('flowPool.operatorName')">
+            <a-option v-for="item of sourceList" :value="item.id" :label="item.label" />
           </a-select>
         </a-form-item>
         <a-form-item field="label" :label="$t('flowPool.start_time')">
-          <a-date-picker style="width: 200px;" :placeholder="$t('flowPool.start_timeName')"/>
+          <a-date-picker style="width: 200px;" :placeholder="$t('flowPool.start_timeName')" />
         </a-form-item>
         <a-form-item>
           <a-space>
@@ -33,7 +32,7 @@
     <div class="audit-btn">
       <a-button @click="dictShowModel(1, null)" type="text" v-if="role == 1">
         <template #icon>
-          <icon-plus-circle/>
+          <icon-plus-circle />
         </template>
         <template #default>
           {{ $t('form.Add') }}
@@ -42,21 +41,21 @@
     </div>
 
     <a-table row-key="id" :data="dataSource" :columns="columns" :pagination="pagination" :scroll="{ x: 'auto' }"
-             @page-change="evChangePage">
+      @page-change="evChangePage">
       <template #id="{ record }">
         <!-- 修改 -->
         <a class="a-link" href="javascript:;" style="margin-right: 1rem" @click="dictShowModel(2, record)"
-           v-if="role == 1">{{
+          v-if="role == 1">{{
             $t('form.Edit')
           }}</a>
         <a class="a-link" href="javascript:;" style="margin-right: 1rem" @click="handelForewring(record)"
-           v-if="role == 1">预警</a>
+          v-if="role == 1">预警</a>
         <!-- 删除 -->
-        <a-popconfirm :content="$t('form.Delete')" :ok-text="$t('form.Confirm')"
-                      :cancel-text="$t('form.Cancel')" @ok="handleDel(record.id)">
+        <a-popconfirm :content="$t('form.Delete')" :ok-text="$t('form.Confirm')" :cancel-text="$t('form.Cancel')"
+          @ok="handleDel(record.id)">
           <a class="a-link" href="javascript:;" style="margin-right: 1rem" v-if="role == 1">{{
-              $t('form.Delete')
-            }}</a>
+            $t('form.Delete')
+          }}</a>
         </a-popconfirm>
       </template>
 
@@ -64,85 +63,25 @@
 
 
 
-    <add  v-model:model-value="showAdd" status="1" :typeCurrent="typeCurrent" :record="record" @submit="intData()"></add>
-    <Forewarning v-model:modelValue="visibleForewarning" :FormDataList="FormDataList" @submit="intData()"/>
+    <add v-model:model-value="showAdd" status="1" :typeCurrent="typeCurrent" :record="record" @submit="intData()"></add>
+    <Forewarning v-model:modelValue="visibleForewarning" :FormDataList="FormDataList" @submit="intData()" />
+    <openExport v-model:model-value="ShowOpenExport" />
 
-    <a-modal v-model:visible="openExport" @ok="handleOk" @cancel="handleCancel" width="1000px">
-      <template #title>
-        批量导入
-      </template>
-      <div class="export-box">
-        <div class="export-box-item">
-          <div class="box-item-title">
-            <div class="title-icon"></div>
-            批量导入
-          </div>
-          <div class="box-item-content">
-            <a-form :model="searchForm">
-              <a-form-item field="label" :label="$t('flowPool.label')">
-                <a-input v-model="searchForm.label" :placeholder="$t('lotCard.please') + $t('flowPool.label')"
-                         allow-clear/>
-              </a-form-item>
-              <a-form-item field="label" :label="$t('flowPool.status')">
-                <a-select v-model="value" :style="{width:'240px'}" :placeholder="$t('flowPool.flowPoolStatus')">
-                  <a-option v-for="item of trafficList" :value="item.id" :label="item.label"/>
-                </a-select>
-              </a-form-item>
-              <a-form-item field="label" :label="$t('flowPool.operator')">
-                <a-select v-model="value" :style="{width:'240px'}" :placeholder="$t('flowPool.operatorName')">
-                  <a-option v-for="item of sourceList" :value="item.id" :label="item.label"/>
-                </a-select>
-              </a-form-item>
-              <a-form-item field="label" :label="$t('flowPool.start_time')">
-                <a-date-picker style="width: 200px;" :placeholder="$t('flowPool.start_timeName')"/>
-              </a-form-item>
-            </a-form>
-          </div>
-        </div>
-        <div class="export-box-item" style="margin-top:20px;">
-          <div class="box-item-title">
-            <div class="title-icon"></div>
-            导入结果
-          </div>
-          <div class="box-item-content">
-            <a-table :columns="columnsExport" :data="dataExport" :pagination="paginationCard" :scroll="{ x: 'auto' }"
-                     @page-change="evChangePageCard">
-              <template #operate="{ record }">
-                <a-button @click="openContract(record)" type="text">下载</a-button>
-              </template>
-              <template #status="{ record }">
-                <div class="export-status" v-if="record.status == 1">
-                  <div class="status-icon" style="background: rgba(82, 196, 27, 1);"></div>
-                  导入成功
-                </div>
-                <div class="export-status" v-if="record.status == 2">
-                  <div class="status-icon" style="background: rgba(250, 173, 20, 1);"></div>
-                  部分成功
-                </div>
-                <div class="export-status" v-if="record.status == 3">
-                  <div class="status-icon" style="background: rgba(247, 66, 75, 1);"></div>
-                  校验失败
-                </div>
-              </template>
-            </a-table>
-          </div>
-        </div>
-      </div>
-    </a-modal>
   </div>
 </template>
 
 <script setup>
-import {onMounted, ref, reactive, getCurrentInstance, nextTick, watch, toRefs} from "vue";
-import {columns} from "./config";
-import {Message, Notification} from '@arco-design/web-vue'
+import { onMounted, ref, getCurrentInstance, nextTick, watch, toRefs } from "vue";
+import { columns } from "./config";
+import { Message } from '@arco-design/web-vue'
 import {
   deleteTrafficPool,
   lotCatdList,
 } from "@/api/path/flowPool.api"
-import {useSystemStore} from "@/store/modules/systemStore"
-import Forewarning from "./forewarning.vue";
-import add from './add.vue'
+import { useSystemStore } from "@/store/modules/systemStore"
+import Forewarning from "./components/forewarning.vue";
+import add from './components/add.vue'
+import openExport from "./components/openExport.vue"
 const systemStore = useSystemStore()
 const state = ref({
   role: systemStore.getRole,
@@ -156,62 +95,34 @@ const state = ref({
     pageSize: 10,
     current: 1,
   },
-  paginationCard: {
-    total: 0,
-    pageSize: 10,
-    current: 1,
-  },
   sourceList: [],
   trafficList: [],
   typeList: [],
   tariffIdList: [],
-  openExport: false,
-  dataExport: [],
-  visibleForewarning:false,
-  showAdd:false,
-  typeCurrent:1,
-  record:{},
-  dataSource:[],
-  FormDataList:{}
+  ShowOpenExport: false,
+  visibleForewarning: false,
+  showAdd: false,
+  typeCurrent: 1,
+  record: {},
+  dataSource: [],
+  FormDataList: {}
 })
 const {
   role,
   searchForm,
   pagination,
-  paginationCard,
   typeCurrent,
   sourceList,
   trafficList,
-  openExport,
-  dataExport,
+  ShowOpenExport,
   visibleForewarning,
   showAdd,
   record,
   dataSource,
   FormDataList
 } = toRefs(state.value)
-const {proxy} = getCurrentInstance()
-const columnsExport = [
-  {title: '序号', dataIndex: 'index', align: 'center', render: ({rowIndex}) => rowIndex + 1},
-  {
-    title: '操作人',
-    dataIndex: 'name',
-  },
-  {
-    title: '导入时间',
-    dataIndex: 'exportTime',
-  },
-  {
-    title: '完成时间',
-    dataIndex: 'successTime',
-  },
-  {
-    title: '状态',
-    slotName: 'status',
-    align: 'center'
-  },
-  {title: '操作', slotName: 'operate', align: 'center'},
-];
+const { proxy } = getCurrentInstance()
+
 const intData = async () => {
   const param = {
     current: pagination.value.current,
@@ -219,7 +130,7 @@ const intData = async () => {
     ...searchForm.value,
     type: 1
   }
-  const {data} = await lotCatdList(param)
+  const { data } = await lotCatdList(param)
   dataSource.value = (data.records || []).map((item, index) => {
     // const trafficPoolType = typeList.value.find(val => val.value == item.trafficPoolType)?.label
     const trafficPoolStatus = trafficList.value.find(val => val.value == item.status)?.label
@@ -239,7 +150,7 @@ const intData = async () => {
 }
 // 删除
 const handleDel = async (id) => {
-  const {code} = await deleteTrafficPool({id})
+  const { code } = await deleteTrafficPool({ id })
   if (code == 200) {
     Message.success({
       content: "删除成功！",
@@ -253,12 +164,6 @@ const evChangePage = (page) => {
   pagination.value.current = page
   intData()
 }
-// 卡信息
-const evChangePageCard = (page) => {
-  paginationCard.value.current = page
-  intData()
-}
-
 const handleSearch = () => {
   intData()
 }
@@ -274,7 +179,7 @@ const dictShowModel = (type, data) => {
   showAdd.value = true
 }
 
-const handelForewring = (item)=>{
+const handelForewring = (item) => {
   FormDataList.value = item
   visibleForewarning.value = true
 }
@@ -290,9 +195,6 @@ onMounted(async () => {
   margin-right: 10px;
 }
 
-.head-title-right {
-}
-
 .search-section {
   margin-top: 20px;
   margin-bottom: 20px;
@@ -332,90 +234,4 @@ silent-expire-alarm {
 .audit-btn {
   margin-bottom: 10px;
 }
-
-
-.echarts-box {
-  // width: 100%;
-  display: flex;
-  justify-content: center;
-  overflow: hidden;
-
-  .chart-dom {
-    width: 700px !important;
-    height: 400px !important;
-  }
-}
-
-.form-item-space-item {
-  background-color: #f2f3f5;
-  display: flex;
-  align-items: center;
-  font-size: 14px;
-}
-
-
-.export-box {
-  .export-box-item {
-    .box-item-title {
-      display: flex;
-      align-items: center;
-      font-family: PingFang SC;
-      font-size: 16px;
-      font-weight: 600;
-      line-height: 24px;
-      color: rgba(0, 0, 0, 0.85);
-      margin-bottom: 10px;
-
-      .title-icon {
-        margin-right: 10px;
-        width: 4px;
-        height: 16px;
-        background: #1B5DF8;
-
-      }
-    }
-
-    .box-item-content {
-      .item-txt {
-        display: flex;
-        align-items: center;
-        margin-bottom: 10px;
-
-        .item-txt-title {
-          width: 300px;
-          text-align: right;
-          margin-right: 10px;
-        }
-
-        .item-txt-text {
-          font-family: PingFang SC;
-          font-size: 14px;
-          font-weight: 400;
-          line-height: 22px;
-          text-align: left;
-          color: #1B5DF8;
-
-        }
-      }
-
-      .export-status {
-        font-family: PingFang SC;
-        font-size: 14px;
-        font-weight: 400;
-        line-height: 22px;
-        text-align: left;
-        color: rgba(51, 51, 51, 1);
-        display: flex;
-        align-items: center;
-
-        .status-icon {
-          width: 6px;
-          height: 6px;
-          border-radius: 50%;
-          margin-right: 10px;
-        }
-      }
-    }
-  }
-}
 </style>

src/views/flowPool/rearFlowPool/index.vue

@@ -149,8 +149,8 @@ import {
   lotCatdList,
 } from "@/api/path/flowPool.api"
 import {useSystemStore} from "@/store/modules/systemStore"
-import add from '../add.vue'
-import Forewarning from '../forewarning.vue'
+import add from '../components/add.vue'
+import Forewarning from '../components/forewarning.vue'
 const systemStore = useSystemStore()
 const role = ref(systemStore.getRole)
 const typeCurrent = ref(1)

src/views/tariffManagement/Management/add.vue

@@ -0,0 +1,343 @@
+<template>
+    <!--资费 弹框 -->
+    <a-modal :title="typeIndex == 1 ? $t('form.Add') : $t('form.Edit')" v-model:visible="modelValue"
+        @onCancel="resetForm" centered :maskClosable="false" :footer="null" width="700px">
+        <a-form ref="formRef" :rules="rules" :model="formState" @submit="handleSubmit">
+            <div class="formTitle">基本信息</div>
+            <a-form-item :label="$t('tariffManagement.source')" field="source">
+                <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">
+                        <a-option v-for=" (item, index) in planList" :key="item.id" :value="item.id"> 流量包{{
+                            item.productName
+                        }}
+                        </a-option>
+                    </a-select>
+                </a-form-item>
+            </template>
+            <a-form-item :label="$t('tariffManagement.label')" field="label">
+                <a-input v-model="formState.label" />
+            </a-form-item>
+            <a-form-item :label="$t('tariffManagement.userId')" field="userId">
+                <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>
+            <a-form-item :label="$t('tariffManagement.billingMethod')" field="billingMethod">
+                <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>
+            <a-form-item :label="$t('tariffManagement.currency')" field="currency">
+                <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>
+            <div class="formTitle">计费信息</div>
+            <a-form-item field="billingCycle" :label="$t('tariffManagement.billingCycle')" required>
+                <a-radio-group v-model="formState.billingCycle" :options="billingCycleData">
+                </a-radio-group>
+            </a-form-item>
+            <a-form-item field="" :label="$t('tariffManagement.pricing')" required>
+                <a-input v-model="formState.pricing" v-if="formState.billingMethod == 2">
+                    <template #append>
+                        {{ formState.currency === '0' ? '元' : '美金' }}
+                    </template>
+                </a-input>
+                <a-input v-model="formState.trafficBilling" v-if="formState.billingMethod == 1"></a-input>
+                <a-select v-model="formState.trafficBillingType" style="width: 80px; margin:0 8px;"
+                    v-if="formState.billingMethod == 1">
+                    <a-option value="KB">KB</a-option>
+                    <a-option value="MB">MB</a-option>
+                    <a-option value="GB">GB</a-option>
+                </a-select>
+                <a-input v-model="formState.trafficBillingAmount" v-if="formState.billingMethod == 1">
+                    <template #append>
+                        {{ formState.currency === '0' ? '元' : '美金' }}
+                    </template>
+                </a-input>
+            </a-form-item>
+            <a-form-item field="settlementCycle" :label="$t('tariffManagement.cycleBuy')">
+                <a-input v-model="formState.settlementCycleMap.starTime">
+                    <template #prepend>
+                        最短
+                    </template>
+                    <template #append>
+                        个月，最长
+                    </template>
+                </a-input>
+                <a-input v-model="formState.settlementCycleMap.endTime" style="width: 50%;">
+                    <template #append>
+                        个月
+                    </template>
+                </a-input>
+            </a-form-item>
+            <a-form-item :label="$t('tariffManagement.MRCName')" field="mrcAmount">
+                <a-input v-model="formState.mrcAmount">
+                    <template #append>
+                        {{ formState.currency === '0' ? '元' : '美金' }}
+                    </template>
+                </a-input>
+            </a-form-item>
+            <a-form-item :label="$t('tariffManagement.networkName')" field="networkAccessFee">
+                <a-input v-model="formState.networkAccessFee">
+                    <template #append>
+                        {{ formState.currency === '0' ? '元' : '美金' }}
+                    </template>
+                </a-input>
+            </a-form-item>
+            <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>
+        </a-form>
+    </a-modal>
+</template>
+
+<script setup>
+import { ref, onMounted, toRefs, toRef, watch } from 'vue';
+import { getDataPlanList } from "@/api/path/lotCard.api"
+import { getSTSInfoList } from '@/api/path/system.api'
+import { updateTariff, addTariff } from "@/api/path/tariffManagement.api"
+import { Getdictionary } from '@/mixins/index.js'
+import { Message } from '@arco-design/web-vue'
+
+const props = defineProps({
+    modelValue: {
+        type: Boolean,
+        default: false
+    },
+    typeIndex: {
+        type: Number,
+        default: null
+    },
+    FormDataList: {
+        type: Object,
+        default: () => { }
+    }
+})
+
+const modelValue = toRef(props, 'modelValue')
+const typeIndex = toRef(props, 'typeIndex')
+const FormDataList = toRef(props, 'FormDataList')
+const emit = defineEmits(['update:modelValue', 'submit'])
+
+const state = ref({
+    formState: {
+        // 资费名称（必填）
+        "label": "",
+        // 流量包ID（必填）
+        "simDataPlanId": null,
+        // 用户ID（必填）
+        "userId": null,
+        // 来源（必填）
+        "source": "",
+        // 计费周期（必填）
+        "billingCycle": "",
+        // 计费方式（必填）
+        "billingMethod": "1",
+        // 结算周期（必填）
+        "settlementCycle": "",
+        // 价格（必填）
+        "pricing": "",
+        // 币种（必填）
+        "currency": "0",
+        // 流量资费计费
+        "trafficBilling": '',
+        // 流量资费计费类型
+        "trafficBillingType": '',
+        // 流量资费计费金
+        "trafficBillingAmount": '',
+        // MRC金额
+        "mrcAmount": '',
+        // 网络接入费
+        "networkAccessFee": '',
+
+        "settlementCycleMap": {
+            "starTime": '',
+            "endTime": ''
+        }
+    },
+    sourceList: [],
+    userIdList: [],
+    methodList: [],
+    currency: [],
+    billingCycleData: [],
+    planList: [],
+    formRef: null
+
+})
+
+const { formState, sourceList, userIdList, methodList, currency, billingCycleData, planList, formRef } = toRefs(state.value)
+
+const rules = {
+    label: [{ required: true, trigger: 'change', }],
+    simDataPlanId: [{ required: true, trigger: 'change', }],
+    userId: [{ required: true, trigger: 'change', }],
+    source: [{ required: true, trigger: 'change', }],
+    billingCycle: [{ required: true, trigger: 'change', }],
+    billingMethod: [{ required: true, trigger: 'change', }],
+    currency: [{ required: true, trigger: 'change', }],
+    trafficBilling: [{ required: true, trigger: 'change', }],
+    trafficBillingType: [{ required: true, trigger: 'change', }],
+    trafficBillingAmount: [{ required: true, trigger: 'change', }],
+    mrcAmount: [{ required: true, trigger: 'change', }],
+    networkAccessFee: [{ required: true, trigger: 'change', }],
+};
+
+
+// 提交
+const handleSubmit = ({ values, errors }) => {
+    formRef.value.validate(async (errors) => {
+        if (!errors) {
+            const formVal = JSON.parse(JSON.stringify(values))
+            delete formVal.settlementCycleMap
+            formVal.userId = Number(values.userId)
+            formVal.simDataPlanId = String(values.simDataPlanId)
+            if (values.settlementCycleMap.starTime && values.settlementCycleMap.starTime) {
+                formVal.settlementCycle = values.settlementCycleMap.starTime + '~' + values.settlementCycleMap.endTime
+            } else {
+                Message.warning({
+                    content: "请选择订购周期！",
+                    duration: 2000,
+                })
+            }
+
+            if (typeIndex.value === 2) {
+                const { code, data } = await updateTariff(formVal)
+
+                if (code == 200) {
+                    Message.success({
+                        content: "修改成功！",
+                        duration: 2000,
+                    })
+                    emit('update:modelValue', false)
+                    emit('submit', true)
+                }
+            } else {
+                const { code, data } = await addTariff(formVal)
+                if (code == 200) {
+                    Message.success({
+                        content: "添加成功！",
+                        duration: 2000,
+                    })
+                    emit('update:modelValue', false)
+                    emit('submit', true)
+                }
+            }
+        }
+    });
+}
+
+// 取消
+const resetForm = () => {
+    emit('update:modelValue', false)
+    Object.keys(formState.value).forEach(key => {
+        formState.value[key] = ''
+    })
+    delete formState.value.id
+    formState.value.settlementCycleMap = {
+        starTime: '',
+        endTime: ''
+    }
+    FormDataList.value = {}
+}
+
+const handleDataPlan = async () => {
+    const param = {
+        current: 1,
+        size: 999,
+        source: formState.value.source
+    }
+    getDataPlanList(param).then(res => {
+        planList.value = res.data.records || []
+    })
+}
+
+// 获取id数组
+const handleModelId = async () => {
+    const param = {
+        current: 1,
+        size: 999,
+    }
+    getSTSInfoList(param).then(res => {
+        userIdList.value = (res.data.records || [])
+    })
+}
+
+const handleDictValue = async () => {
+    sourceList.value = await Getdictionary('source')
+    methodList.value = await Getdictionary('billingMethod')
+    currency.value = await Getdictionary('currencyType')
+    billingCycleData.value = await Getdictionary('Billingcycle')
+}
+
+watch(() => modelValue.value, val => {
+    if (val) {
+        handleDictValue()
+        handleModelId()
+    }
+})
+
+watch(() => formState.value.billingMethod, val => {
+    if (val == 2) {
+        formState.value.trafficBillingType = ''
+        formState.value.trafficBilling = ''
+        formState.value.trafficBillingAmount = ''
+    }
+})
+
+watch(
+    () => formState.value.source,
+    (newValue, oldValue) => {
+
+        if (newValue != oldValue) {
+            handleDataPlan()
+        }
+    },
+    { immediate: true }
+);
+
+
+watch(() => FormDataList.value, val => {
+    if (!val.id) return
+    if (formState.value.settlementCycleMap) {
+        formState.value.settlementCycleMap.starTime = ''
+        formState.value.settlementCycleMap.endTime = ''
+    }
+    Object.keys(formState.value).forEach(key => {
+        if (val[key]) {
+            formState.value[key] = val[key]
+        }
+    })
+    formState.value.userId = Number(formState.value.userId)
+    if (val.pricing !== '') {
+        formState.value.pricing = val.pricing.match(/\d+/)[0] || ''
+    }
+    if (val.settlementCycle) {
+        formState.value.settlementCycleMap.starTime = val.settlementCycle.split('~')[0] || ''
+        formState.value.settlementCycleMap.endTime = val.settlementCycle.split('~')[1] || ''
+    }
+    formState.value.id = val.id
+})
+</script>
+<style scoped></style>

src/views/tariffManagement/Management/meal.vue

@@ -0,0 +1,79 @@
+<template>
+    <a-modal width="50%" v-model:visible="modelValue" @ok="handleOk" @cancel="handleCancel" title="套餐">
+        <div class="add"><a-button type="primary" @click="addMeal">添加套餐</a-button></div>
+        <div class="item_warp">
+            <div v-for="(item, index) in wanberFloter">
+                <a-card :title="'套餐' + (index + 1)">
+                    <template #extra>
+                        <a-link @click="deletaMeal(index)">删除</a-link>
+                    </template>
+                    <div class="Form">
+                        <a-form :model="item" auto-label-width :rules="rules" ref="formRef">
+                            <a-form-item field="PackageTerm" label="套餐期限">
+                                <a-input v-model="item.PackageTerm" placeholder="请输入" />
+                            </a-form-item>
+                            <a-form-item field="PackagePrice" label="套餐价格">
+                                <a-input v-model="item.PackagePrice" placeholder="请输入" />
+                            </a-form-item>
+                            <a-form-item field="SetSize" label="套餐大小">
+                                <a-input v-model="item.SetSize" placeholder="请输入" />
+                            </a-form-item>
+                        </a-form>
+                    </div>
+                </a-card>
+            </div>
+        </div>
+    </a-modal>
+</template>
+
+<script setup>
+import { ref, onMounted, toRefs, toRef, watch } from 'vue';
+const props = defineProps({
+    modelValue: {
+        type: Boolean,
+        default: false
+    },
+})
+
+const modelValue = toRef(props, 'modelValue')
+const emit = defineEmits(['update:modelValue', 'submit'])
+const rules = {
+    PackageTerm: [{ required: true, trigger: 'change', }],
+    PackagePrice: [{ required: true, trigger: 'change', }],
+    SetSize: [{ required: true, trigger: 'change', }],
+}
+const state = ref({
+    wanberFloter: [
+        {  PackageTerm: '', PackagePrice: '', SetSize: '' }
+    ],
+    formRef:null
+})
+const { wanberFloter ,formRef} = toRefs(state.value)
+const handleOk = () => {
+    emit('update:modelValue', false)
+}
+const handleCancel = () => {
+    emit('update:modelValue', false)
+}
+const addMeal = ()=>{
+    wanberFloter.value.push({ PackageTerm: '', PackagePrice: '', SetSize: '' })
+}
+const deletaMeal = (index)=>{
+    if(wanberFloter.value.length!==1){
+        wanberFloter.value.splice(index, 1)
+    }
+}
+</script>
+<style scoped lang="less">
+.add {
+    display: flex;
+    justify-content: end;
+}
+
+.item_warp {
+    margin-top: 20px;
+    display: flex;
+    flex-wrap: wrap;
+    gap: 15px;
+}
+</style>

src/views/tariffManagement/index.vue

@@ -57,6 +57,7 @@
         <a class="a-link" href="javascript:;" style="margin-right: 1rem" @click="dictShowModel(2, record)">{{
           $t('form.Edit')
         }}</a>
+        <a class="a-link" href="javascript:;" style="margin-right: 1rem" @click="meal(2, record)">套餐</a>
         <!-- 删除 -->
         <a-popconfirm :content="$t('form.Delete')" :ok-text="$t('form.Confirm')" :cancel-text="$t('form.Cancel')"
           @ok="handleDel(record.id)">
@@ -65,123 +66,9 @@
           }}</a>
         </a-popconfirm>
       </template>
-
     </a-table>
 
 
-    <!--资费 弹框 -->
-    <a-modal :title="typeCurrent == 1 ? $t('form.Add') : $t('form.Edit')" v-model:visible="visible"
-      @onCancel="resetForm" centered :maskClosable="false" :footer="null" width="700px">
-      <a-form ref="formRef" :rules="rules" :model="formState" @submit="handleSubmit">
-        <div class="formTitle">基本信息</div>
-        <a-form-item :label="$t('tariffManagement.source')" field="source">
-          <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">
-              <a-option v-for=" (item, index) in planList" :key="item.id" :value="item.id"> 流量包{{
-                item.productName
-              }}
-              </a-option>
-            </a-select>
-          </a-form-item>
-        </template>
-        <a-form-item :label="$t('tariffManagement.label')" field="label">
-          <a-input v-model="formState.label" />
-        </a-form-item>
-        <a-form-item :label="$t('tariffManagement.userId')" field="userId">
-          <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>
-        <a-form-item :label="$t('tariffManagement.billingMethod')" field="billingMethod">
-          <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>
-        <a-form-item :label="$t('tariffManagement.currency')" field="currency">
-          <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>
-        <div class="formTitle">计费信息</div>
-        <a-form-item field="billingCycle" :label="$t('tariffManagement.billingCycle')" required>
-          <a-radio-group v-model="formState.billingCycle" :options="billingCycleData">
-          </a-radio-group>
-        </a-form-item>
-        <a-form-item field="" :label="$t('tariffManagement.pricing')" required>
-          <a-input v-model="formState.pricing" v-if="formState.billingMethod == 2">
-            <template #append>
-              {{ formState.currency === '0' ? '元' : '美金' }}
-            </template>
-          </a-input>
-          <a-input v-model="formState.trafficBilling" v-if="formState.billingMethod == 1"></a-input>
-          <a-select v-model="formState.trafficBillingType" style="width: 80px; margin:0 8px;"
-            v-if="formState.billingMethod == 1">
-            <a-option value="KB">KB</a-option>
-            <a-option value="MB">MB</a-option>
-            <a-option value="GB">GB</a-option>
-          </a-select>
-          <a-input v-model="formState.trafficBillingAmount" v-if="formState.billingMethod == 1">
-            <template #append>
-              {{ formState.currency === '0' ? '元' : '美金' }}
-            </template>
-          </a-input>
-        </a-form-item>
-        <a-form-item field="settlementCycle" :label="$t('tariffManagement.cycleBuy')">
-          <a-input v-model="formState.settlementCycleMap.starTime">
-            <template #prepend>
-              最短
-            </template>
-            <template #append>
-              个月，最长
-            </template>
-          </a-input>
-          <a-input v-model="formState.settlementCycleMap.endTime" style="width: 50%;">
-            <template #append>
-              个月
-            </template>
-          </a-input>
-        </a-form-item>
-        <a-form-item :label="$t('tariffManagement.MRCName')" field="mrcAmount">
-          <a-input v-model="formState.mrcAmount">
-            <template #append>
-              {{ formState.currency === '0' ? '元' : '美金' }}
-            </template>
-          </a-input>
-        </a-form-item>
-        <a-form-item :label="$t('tariffManagement.networkName')" field="networkAccessFee">
-          <a-input v-model="formState.networkAccessFee">
-            <template #append>
-              {{ formState.currency === '0' ? '元' : '美金' }}
-            </template>
-          </a-input>
-        </a-form-item>
-        <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>
-      </a-form>
-    </a-modal>
-
 
     <a-modal width="70%" :visible="planVisible" title="选择流量包" @ok="handleSubmitPlan" @cancel="handleCancel">
       <!-- 搜索条件区 -->
@@ -205,39 +92,67 @@
       </a-table>
 
     </a-modal>
+
+    <Meal v-model:model-value="modealShow" />
+    <Add v-model:model-value="visible" :type-index="typeCurrent" :FormDataList="FormDataList" @submit="intData()"></Add>
   </div>
 </template>
 
 <script setup>
-import { onMounted, ref, reactive, getCurrentInstance, nextTick, watch } from "vue";
+import { onMounted, ref, toRefs, getCurrentInstance } from "vue";
 import { useRoute } from "vue-router";
 import { columns, columnsCustomer, planColumns } from "./config";
-import { Message } from '@arco-design/web-vue'
-import { deleteTariff, updateTariff, addTariff, tariffList } from "@/api/path/tariffManagement.api"
-import { getDataPlanList } from "@/api/path/lotCard.api"
-import { getSTSInfoList } from '@/api/path/system.api'
+import { deleteTariff, tariffList } from "@/api/path/tariffManagement.api"
 import { Getdictionary } from '@/mixins/index.js'
 import { useSystemStore } from '@/store/modules/systemStore'
-
+import Meal from './Management/meal.vue'
+import Add from './Management/add.vue'
 const role = useSystemStore()
-
-
 const { proxy } = getCurrentInstance()
-const formRef = ref()
-const searchForm = ref({
-  "label": "",
-});
-
-const currency = ref([])
-
-const billingCycleData = ref([])
-const dataSource = ref([]);
 const route = useRoute();
-const pagination = ref({
-  total: 0,
-  pageSize: 10,
-  current: 1,
+
+const state = ref({
+  searchForm: { "label": "", },
+  FormDataList: {},
+  currency: [],
+  dataSource: [],
+  pagination: {
+    total: 0,
+    pageSize: 10,
+    current: 1,
+  },
+  planList: [],
+  visible: false,
+  typeCurrent: null,
+  sourceList: [],
+  cycleist: [],
+  modealShow: false,
+  planVisible: false,
+  formData: {},
+  selectedKeysPlan: [],
+  rowSelectionPlan: {
+    type: 'radio',
+    showCheckedAll: true,
+    onlyCurrent: false,
+  }
 })
+const {
+  searchForm,
+  FormDataList,
+  currency,
+  dataSource,
+  pagination,
+  planList,
+  visible,
+  typeCurrent,
+  sourceList,
+  cycleist,
+  modealShow,
+  planVisible,
+  formData,
+  selectedKeysPlan,
+  rowSelectionPlan
+} = toRefs(state.value);
 
 const intData = async () => {
   const param = {
@@ -251,7 +166,7 @@ const intData = async () => {
     const billingCycleName = cycleist.value.find(val => val.value == item.billingCycle)?.label
     const pricingCurrty = currency.value.find(val => val.value == item.currency)?.label || '人民币'
     const Activated = item.trafficBilling + '/' + item.trafficBillingType
-    const bagSize = item.pricing+'/'+item.mrcAmount+'/'+item.networkAccessFee
+    const bagSize = item.pricing + '/' + item.mrcAmount + '/' + item.networkAccessFee
     return {
       ...item,
       sourceName,
@@ -292,194 +207,13 @@ const resetSearch = () => {
 }
 
 
-// -------------------弹窗数据------------------------------------
-const planList = ref([])
-const userIdList = ref([])
-
-
-const visible = ref(false);
-const typeCurrent = ref(null);
-const sourceList = ref([])
-const trafficList = ref([])
-const cycleist = ref([])
-const typeList = ref([])
-const methodList = ref([])
-const settlementCycleMap = ref([])
-
-const formState = ref({
-  // 资费名称（必填）
-  "label": "",
-  // 流量包ID（必填）
-  "simDataPlanId": null,
-  // 用户ID（必填）
-  "userId": null,
-  // 来源（必填）
-  "source": "",
-  // 计费周期（必填）
-  "billingCycle": "",
-  // 计费方式（必填）
-  "billingMethod": "1",
-  // 结算周期（必填）
-  "settlementCycle": "",
-  // 价格（必填）
-  "pricing": "",
-  // 币种（必填）
-  "currency": "0",
-  // 流量资费计费
-  "trafficBilling": '',
-  // 流量资费计费类型
-  "trafficBillingType": '',
-  // 流量资费计费金
-  "trafficBillingAmount": '',
-  // MRC金额
-  "mrcAmount": '',
-  // 网络接入费
-  "networkAccessFee": '',
-
-  "settlementCycleMap": {
-    "starTime": '',
-    "endTime": ''
-  }
-});
-
-const rules = {
-  label: [{ required: true, trigger: 'change', }],
-  simDataPlanId: [{ required: true, trigger: 'change', }],
-  userId: [{ required: true, trigger: 'change', }],
-  source: [{ required: true, trigger: 'change', }],
-  billingCycle: [{ required: true, trigger: 'change', }],
-  billingMethod: [{ required: true, trigger: 'change', }],
-  currency: [{ required: true, trigger: 'change', }],
-  trafficBilling: [{ required: true, trigger: 'change', }],
-  trafficBillingType: [{ required: true, trigger: 'change', }],
-  trafficBillingAmount: [{ required: true, trigger: 'change', }],
-  mrcAmount: [{ required: true, trigger: 'change', }],
-  networkAccessFee: [{ required: true, trigger: 'change', }],
-};
-
-
-// 提交
-const handleSubmit = ({ values, errors }) => {
-  formRef.value.validate(async (errors) => {
-    if (!errors) {
-      const formVal = JSON.parse(JSON.stringify(values))
-      delete formVal.settlementCycleMap
-      formVal.userId = Number(values.userId)
-      formVal.simDataPlanId = String(values.simDataPlanId)
-      if (values.settlementCycleMap.starTime && values.settlementCycleMap.starTime) {
-        formVal.settlementCycle = values.settlementCycleMap.starTime + '~' + values.settlementCycleMap.endTime
-      } else {
-        Message.warning({
-          content: "请选择订购周期！",
-          duration: 2000,
-        })
-      }
-
-      if (formState.value.id) {
-        const { code, data } = await updateTariff(formVal)
-
-        if (code == 200) {
-          Message.success({
-            content: "修改成功！",
-            duration: 2000,
-          })
-          visible.value = false;
-          intData()
-        }
-      } else {
-        const { code, data } = await addTariff(formVal)
-        if (code == 200) {
-          Message.success({
-            content: "添加成功！",
-            duration: 2000,
-          })
-          visible.value = false;
-          intData()
-        }
-      }
-    }
-  });
-
-}
 // 弹框
 const dictShowModel = (type, data) => {
-  handleModelId()
-  formRef.value.resetFields();
-  if (formState.value.settlementCycleMap) {
-    formState.value.settlementCycleMap.starTime = ''
-    formState.value.settlementCycleMap.endTime = ''
-  }
-
+  FormDataList.value = type == 1 ? {} : data
   typeCurrent.value = type;
-
-  // 编辑
-  if (type == 2) {
-    Object.keys(formState.value).forEach(key => {
-      if (data[key]) {
-        formState.value[key] = data[key]
-      }
-    })
-    formState.value.id = data.id
-    formState.value.userId = Number(formState.value.userId)
-    if (data.pricing !== '') {
-      formState.value.pricing = data.pricing.match(/\d+/)[0] || ''
-    }
-    if (data.settlementCycle) {
-      formState.value.settlementCycleMap.starTime = data.settlementCycle.split('~')[0] || ''
-      formState.value.settlementCycleMap.endTime = data.settlementCycle.split('~')[1] || ''
-    }
-  }
-  nextTick(() => {
-    visible.value = true;
-  })
-}
-
-// 获取id数组
-const handleModelId = async () => {
-  const param = {
-    current: 1,
-    size: 999,
-  }
-  getSTSInfoList(param).then(res => {
-    userIdList.value = (res.data.records || [])
-  })
-}
-const handleDataPlan = async () => {
-  const param = {
-    current: 1,
-    size: 999,
-    source: formState.value.source
-  }
-  getDataPlanList(param).then(res => {
-    planList.value = res.data.records || []
-  })
-}
-// 取消
-const resetForm = () => {
-  visible.value = false;
-  Object.keys(formState.value).forEach(key => {
-    formState.value[key] = ''
-  })
-  delete formState.value.id
-  formState.value.settlementCycleMap = {
-    starTime: '',
-    endTime: ''
-  }
+  visible.value = true;
 }
 
-// --------------------------------------------------------
-
-// 资费弹窗------------------------------------------------
-const planVisible = ref(false)
-const formData = ref({})
-const selectedKeysPlan = ref([])
-const rowSelectionPlan = reactive({
-  type: 'radio',
-  showCheckedAll: true,
-  onlyCurrent: false,
-});
-
-
 const resetSearchPlan = () => {
 
 }
@@ -489,6 +223,7 @@ const handleSearchPlan = () => {
 const handleCancel = () => {
   planVisible.value = false
 }
+
 const handleSubmitPlan = () => {
   if (selectedKeysPlan.value.length > 0) {
     formState.value.simDataPlanId = String(selectedKeysPlan.value[0])
@@ -497,34 +232,15 @@ const handleSubmitPlan = () => {
 
 }
 
-watch(
-  () => formState.value.source,
-  (newValue, oldValue) => {
 
-    if (newValue != oldValue) {
-      handleDataPlan()
-    }
-  },
-  { immediate: true }
-);
-
-watch(() => formState.value.billingMethod, val => {
-  if (val == 2) {
-    formState.value.trafficBillingType = ''
-    formState.value.trafficBilling = ''
-    formState.value.trafficBillingAmount = ''
-  }
-})
-
-// -------------------------------------------------------
-// 获取字典
 const handleDictValue = async () => {
   sourceList.value = await Getdictionary('source')
   cycleist.value = await Getdictionary('Billingcycle')
-  typeList.value = await Getdictionary('Billingcycle')
-  methodList.value = await Getdictionary('billingMethod')
   currency.value = await Getdictionary('currencyType')
-  billingCycleData.value = await Getdictionary('Billingcycle')
+}
+
+const meal = () => {
+  modealShow.value = true
 }