活动管理页面的增删改查对接

用户管理  充值页面的增查对接

src/plugins/api/activity/activity.js

@@ -0,0 +1,30 @@
+import request from "@/plugins/axios";
+export function listApi(data) {
+    return request({
+        url: "/shop/activity/index",
+        method: "post",
+        data,
+    });
+}
+export function addApi(data) {
+    return request({
+        url: "/shop/activity/add",
+        method: "post",
+        data,
+    });
+}
+//  商品修改
+export function saveApi(data) {
+    return request({
+        url: "/shop/activity/edit",
+        method: "post",
+        data,
+    });
+}
+export function delApi(data) {
+    return request({
+        url: "/shop/activity/del",
+        method: "get",
+        params: data,
+    });
+}

src/plugins/api/customer/manage/tab10.js

@@ -0,0 +1,24 @@
+import request from "@/plugins/axios";
+export function listApi(data) {
+    return request({
+        url: "/crm/charge/index",
+        method: "post",
+        data,
+    });
+}
+//  添加/修改
+export function addApi(data) {
+    return request({
+        url: "/crm/charge/add",
+        method: "post",
+        data,
+    });
+}
+// 删除
+export function delApi(data) {
+    return request({
+        url: "/crm/charge/del",
+        method: "post",
+        data,
+    });
+}

src/views/activity/Index.vue

@@ -1,79 +1,125 @@
 <template>
   <div class="manage-order-content">
-  <div
-      class="manage-shopping-tab1"
-      v-loading="loading"
-      element-loading-text="加载中..."
-  >
-    <section v-loading="loading">
-      <div class="manage-shopping-title">
-        <div class="manage-shopping-title-left" style="white-space: nowrap">
-          <el-form inline>
-                <el-form-item>
-                  <el-input style="width: 240px"
-                            v-model="searchForm.name"
-                            placeholder="活动名称"/>
-                </el-form-item>
+    <div
+        class="manage-shopping-tab1"
+        v-loading="loading"
+        element-loading-text="加载中..."
+    >
+      <section v-loading="loading">
+        <div class="manage-shopping-title">
+          <div class="manage-shopping-title-left" style="white-space: nowrap">
+            <el-form inline>
+              <el-form-item>
+                <el-input style="width: 240px"
+                          v-model="searchForm.name"
+                          placeholder="活动名称"/>
+              </el-form-item>
               <el-form-item style="width: 240px">
                 <el-button type="primary" @click="searchFun">查询</el-button>
                 <el-button @click="resetFun">重置</el-button>
               </el-form-item>
-
-          </el-form>
-        </div>
-        <div class="manage-shopping-title-right" style="white-space: nowrap">
-          <el-button type="primary" :icon="Plus" @click="addDeptFun('add')">
-            添加
-          </el-button>
+            </el-form>
+          </div>
+          <div class="manage-shopping-title-right" style="white-space: nowrap">
+            <el-button type="primary" :icon="Plus" @click="addDeptFun('add')">
+              添加
+            </el-button>
+          </div>
         </div>
-      </div>
-      <div class="coupon-table">
-        <el-table
-            border
-            stripe
-            :data="tableData"
-            :height="store.tableHeight - 140"
-            @selection-change="handleSelectionChange"
-        >
-          <el-table-column prop="order_no" label="商品订单单号"/>
-          <el-table-column prop="amount_real" label="订单实际金额"/>
-          <el-table-column prop="created_at" label="订单创建时间" width="170"/>
-          <el-table-column
-              label="操作"
-              width="100"
-              align="center"
-              fixed="right"
+        <div class="coupon-table">
+          <el-table
+              border
+              stripe
+              :data="tableData"
+              :height="store.tableHeight - 140"
+              @selection-change="handleSelectionChange"
           >
-            <template #default="{ row }">
-              <el-button type="primary" link @click="updateOpen(row)">
-                修改
-              </el-button>
-            </template>
-          </el-table-column>
-        </el-table>
-        <div class="pagination-div">
-          <el-pagination
-              v-model:currentPage="currentPage"
-              v-model:page-size="pageSize"
-              :page-sizes="[20, 50, 100, 200]"
-              layout="total, sizes, prev, pager, next, jumper"
-              :total="total"
-              @size-change="handleSizeChange"
-              @current-change="handleCurrentChange"
-          />
-          <div></div>
+            <el-table-column prop="id" label="ID" align="center"/>
+            <el-table-column prop="name" label="活动名" align="center"/>
+            <el-table-column prop="address" label="地点" align="center"/>
+            <el-table-column prop="type" label="活动类型" align="center"/>
+            <el-table-column
+                prop="cover"
+                label="缩略图"
+                width="100"
+                align="center"
+            >
+              <template #default="{ row }">
+                <el-image
+                    :preview-teleported="true"
+                    style="width: 50px; height: 50px"
+                    :src="imgSrc(row.cover)"
+                    :zoom-rate="1.2"
+                    :preview-src-list="[imgSrc(row.cover)]"
+                    :initial-index="4"
+                    fit="cover"
+                />
+              </template>
+            </el-table-column>
+            <el-table-column
+                prop="pic"
+                label="大图"
+                width="100"
+                align="center"
+            >
+              <template #default="{ row }">
+                <el-image
+                    :preview-teleported="true"
+                    style="width: 50px; height: 50px"
+                    :src="imgSrc(row.pic)"
+                    :zoom-rate="1.2"
+                    :preview-src-list="[imgSrc(row.pic)]"
+                    :initial-index="4"
+                    fit="cover"
+                />
+              </template>
+            </el-table-column>
+            <el-table-column prop="fee" label="费用(元)" align="center"/>
+            <el-table-column prop="status" label="状态" align="center"/>
+            <el-table-column prop="entry_max" label="人数限制" align="center"/>
+            <el-table-column prop="entry_num" label="报名人数" align="center"/>
+            <el-table-column prop="address" label="地点" align="center"/>
+            <el-table-column prop="entry_end" label="报名截止时间" width="170" align="center"/>
+            <el-table-column prop="start_time" label="活动开始时间" width="170" align="center"/>
+            <el-table-column prop="end_time" label="活动结束时间" width="170" align="center"/>
+            <el-table-column prop="created_at" label="创建时间" width="170" align="center"/>
+            <el-table-column
+                label="操作"
+                width="180"
+                align="center"
+                fixed="right"
+            >
+              <template #default="{ row }">
+                <el-button type="primary" link @click="updateOpen(row)">
+                  修改
+                </el-button>
+                <el-button type="danger" link @click="delFun(row)">删除</el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+          <div class="pagination-div">
+            <el-pagination
+                v-model:currentPage="currentPage"
+                v-model:page-size="pageSize"
+                :page-sizes="[20, 50, 100, 200]"
+                layout="total, sizes, prev, pager, next, jumper"
+                :total="total"
+                @size-change="handleSizeChange"
+                @current-change="handleCurrentChange"
+            />
+          </div>
         </div>
-      </div>
-    </section>
-    <!-- 新增 -->
-    <addDialog ref="addDialogRef" @refreshTable="refreshTable"/>
-  </div>
+      </section>
+      <!-- 新增 -->
+      <addDialog ref="addDialogRef" @refreshTable="refreshTable"/>
+    </div>
   </div>
 </template>
+
 <script setup>
 import {
-  orderListApi as listApi,
-} from "@/plugins/api/shopping/order";
+  listApi,delApi
+} from "@/plugins/api/activity/activity";
 import {useCounterStore} from "@/stores/counter.js";
 import AddDialog from "@/views/activity/components/AddActivity.vue";
 import {Plus} from "@element-plus/icons-vue";
@@ -86,15 +132,16 @@ let selectData = ref([]);
 let loading = ref(false);
 let addDialogRef = ref(null);
 
-
 const currentPage = ref(1);
 const pageSize = ref(20);
 const total = ref(0);
+
 const handleSizeChange = (val) => {
   pageSize.value = val;
   selectData.value = [];
   getData();
 };
+
 const handleCurrentChange = (val) => {
   currentPage.value = val;
   selectData.value = [];
@@ -108,6 +155,34 @@ function refreshTable() {
   getData();
 }
 
+function imgSrc(path) {
+  return import.meta.env.VITE_APP_BASE_API + path;
+}
+function delFun(row) {
+  ElMessageBox.confirm("确认删除，是否继续?", "提示", {
+    confirmButtonText: "确认",
+    cancelButtonText: "取消",
+    type: "warning",
+  })
+      .then(() => {
+        delApi({
+          id: row.id.toString(),
+        }).then(() => {
+          ElMessage({
+            type: "success",
+            message: "删除成功！",
+          });
+          getData();
+        });
+      })
+      .catch(() => {
+        ElMessage({
+          type: "info",
+          message: "已取消。",
+        });
+      });
+}
+
 function searchFun() {
   currentPage.value = 1;
   selectData.value = [];
@@ -130,7 +205,6 @@ function updateOpen(row) {
   addDialogRef.value.initFun("update", row);
 }
 
-
 function getData() {
   loading.value = true;
   let obj = Object.assign(
@@ -156,12 +230,11 @@ function handleSelectionChange(val) {
   selectData.value = val;
 }
 
-
-//
 onMounted(() => {
   getData();
 });
 </script>
+
 <style scoped lang="scss">
 .manage-order-content {
   width: 100%;
@@ -220,5 +293,11 @@ onMounted(() => {
       justify-content: space-between;
     }
   }
+
+  .pagination-div {
+    display: flex;
+    justify-content: center;
+    margin-top: 10px; // 可选：添加一些间距
+  }
 }
 </style>

src/views/activity/components/AddActivity.vue

@@ -3,7 +3,7 @@
   <el-dialog
       v-model="dialogVisible"
       :title="title"
-      width="30%"
+      width="65%"
       :before-close="handleClose"
   >
     <div class="manage-dialog">
@@ -11,32 +11,154 @@
           ref="ruleFormRef"
           :model="ruleForm"
           :rules="rules"
-          label-width="100px"
+          label-width="120px"
       >
         <el-row :gutter="20">
-          <el-col :span="20">
-              <el-form-item label="人数限制1:" prop="goods_kind">
-                <el-input-number
-                    v-model="ruleForm.goods_kind1"
-                    placeholder="请输入人数限制"
-                    :min="0"
-                    :max="100"
+          <el-col :span="10">
+              <el-form-item label="活动名:" prop="name">
+                <el-input
+                    v-model="ruleForm.name"
+                    placeholder="请输入活动名"
+
                 />
             </el-form-item>
           </el-col>
+          <el-col :span="10">
+            <el-form-item label="活动类型:" prop="type">
+              <el-input
+                  v-model="ruleForm.type"
+                  placeholder="请输入活动类型"
+              />
+            </el-form-item>
+          </el-col>
         </el-row>
+
         <el-row :gutter="20">
-          <el-col :span="20">
-              <el-form-item label="人数限制2:" prop="goods_kind">
-                <el-input-number
-                    v-model="ruleForm.goods_kind1"
-                    placeholder="请输入人数限制"
-                    :min="0"
-                    :max="100"
-                />
-              </el-form-item>
+          <el-col :span="10">
+            <el-form-item label="费用(元):" prop="fee">
+              <el-input-number
+                  v-model="ruleForm.fee"
+                  placeholder="请输入费用(元)"
+                  :min="0"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="10">
+            <el-form-item label="人数限制:" prop="entry_max">
+              <el-input-number
+                  v-model="ruleForm.entry_max"
+                  placeholder="请输入人数限制"
+                  :min="0"
+              />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="10">
+            <el-form-item
+                label="缩略图"
+                style="width: 100%"
+                v-loading="coverLoading"   prop="cover"
+            >
+              <div class="img-box" v-for="(item, i) in coverImgList" :key="i">
+                <img :src="item.url" alt="" />
+                <div class="occlusion">
+                  <el-icon class="del" @click="coverRemove(i)">
+                    <IEpDelete />
+                  </el-icon>
+                </div>
+              </div>
+              <el-upload
+                  action="#"
+                  list-type="picture-card"
+                  :auto-upload="false"
+                  :show-file-list="false"
+                  :file-list="coverImgList"
+                  :on-change="coverOnChange"
+              >
+                <el-icon>
+                  <IEpPlus />
+                </el-icon>
+              </el-upload>
+            </el-form-item>
+          </el-col>
+          <el-col :span="10">
+            <el-form-item
+                label="大图"
+                style="width: 100%"
+                v-loading="picLoading" prop="pic"
+            >
+              <div class="img-box" v-for="(item, i) in picImgList" :key="i">
+                <img :src="item.url" alt="" />
+                <div class="occlusion">
+                  <el-icon class="del" @click="picRemove(i)">
+                    <IEpDelete />
+                  </el-icon>
+                </div>
+              </div>
+              <el-upload
+                  action="#"
+                  list-type="picture-card"
+                  :auto-upload="false"
+                  :show-file-list="false"
+                  :file-list="picImgList"
+                  :on-change="picOnChange"
+              >
+                <el-icon>
+                  <IEpPlus />
+                </el-icon>
+              </el-upload>
+            </el-form-item>
           </el-col>
         </el-row>
+        <el-row :gutter="20">
+          <el-col :span="10">
+            <el-form-item label="地点:" prop="address">
+              <el-input
+                  v-model="ruleForm.address"
+                  placeholder="请输入地点"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="10">
+            <el-form-item label="报名截止时间:" prop="entry_end">
+              <el-date-picker
+                  v-model="ruleForm.entry_end"
+                  type="datetime"
+                  format="YYYY-MM-DD HH:mm:ss"
+                  value-format="YYYY-MM-DD HH:mm:ss"
+                  placeholder="选择日期时间">
+              </el-date-picker>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="10">
+            <el-form-item label="活动开始时间:" prop="start_time">
+              <el-date-picker
+                  v-model="ruleForm.start_time"
+                  type="datetime"
+                  format="YYYY-MM-DD HH:mm:ss"
+                  value-format="YYYY-MM-DD HH:mm:ss"
+                  placeholder="选择日期时间">
+              </el-date-picker>
+            </el-form-item>
+          </el-col>
+          <el-col :span="10">
+            <el-form-item label="活动结束时间:" prop="end_time">
+              <el-date-picker
+                  v-model="ruleForm.end_time"
+                  type="datetime"
+                  format="YYYY-MM-DD HH:mm:ss"
+                  value-format="YYYY-MM-DD HH:mm:ss"
+                  placeholder="选择日期时间">
+              </el-date-picker>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-form-item label="活动详情" style="width: 83%" prop="end_time" >
+          <richPage ref="richPageRef" />
+        </el-form-item>
       </el-form>
     </div>
     <template #footer>
@@ -48,20 +170,87 @@
   </el-dialog>
 </template>
 <script setup>
-import {addApi, saveApi} from "@/plugins/api/shopping/manage";
+import {addApi, saveApi} from "@/plugins/api/activity/activity";
+import {uploadImgApi} from "@/plugins/api/upload";
 
 let ruleForm = ref({});
 let rules = {
-  goods_name: [{required: true, message: "请输入商品名称", trigger: "blur"}],
-  status: [{required: true, message: "选择状态", trigger: "blur"}],
-  cateid: [{required: true, message: "选择商品分类", trigger: "blur"}],
-  truck_type: [
-    {required: true, message: "选择物流配送方式", trigger: "change"},
-  ],
-  truck_code: [{required: true, message: "选择运费模板", trigger: "change"}],
+  name: [{required: true, message: "请输入活动名称", trigger: "blur"}],
+  type: [{required: true, message: "请输入活动类型", trigger: "blur"}],
+  fee: [{required: true, message: "请输入报名费用", trigger: "blur"}],
+  entry_max: [{required: true, message: "请输入人数限制", trigger: "blur"}],
+  cover: [{required: true, message: "请选择缩略图", trigger: "blur"}],
+  pic: [{required: true, message: "请选择活动大图", trigger: "blur"}],
+  address: [{required: true, message: "请输入活动地点", trigger: "blur"}],
+
+  entry_end: [{required: true, message: "请输入截止时间", trigger: "blur"}],
+  start_time: [{required: true, message: "请输入开始时间", trigger: "blur"}],
+  end_time: [{required: true, message: "请输入结束时间", trigger: "blur"}],
+  content: [{required: true, message: "请输入活动描述", trigger: "blur"}],
+
 };
 let dialogVisible = ref(false);
 
+
+// 缩略图
+let coverLoading = ref(false);
+let coverImgList = ref([]);
+function coverOnChange(file) {
+  let formData = new FormData();
+  formData.append("file", file.raw);
+  coverLoading.value = true;
+  uploadImgApi(formData)
+      .then((data) => {
+        let obj = {
+          url: import.meta.env.VITE_APP_BASE_API + data.file_url,
+        };
+        if (coverImgList.value.length > 0) {
+          coverImgList.value = [];
+          coverImgList.value.push(obj);
+        } else {
+          coverImgList.value.push(obj);
+        }
+        ruleForm.value.cover = data.file_url;
+        coverLoading.value = false;
+      })
+      .catch(() => {
+        coverLoading.value = false;
+      });
+}
+function coverRemove(index) {
+  coverImgList.value.splice(index, 1);
+  ruleForm.value.cover = "";
+}
+// 大图
+let picLoading = ref(false);
+let picImgList = ref([]);
+function picOnChange(file) {
+  let formData = new FormData();
+  formData.append("file", file.raw);
+  picLoading.value = true;
+  uploadImgApi(formData)
+      .then((data) => {
+        let obj = {
+          url: import.meta.env.VITE_APP_BASE_API + data.file_url,
+        };
+        if (picImgList.value.length > 0) {
+          picImgList.value = [];
+          picImgList.value.push(obj);
+        } else {
+          picImgList.value.push(obj);
+        }
+        ruleForm.value.pic = data.file_url;
+        picLoading.value = false;
+      })
+      .catch(() => {
+        picLoading.value = false;
+      });
+}
+function picRemove(index) {
+  picImgList.value.splice(index, 1);
+  ruleForm.value.pic = "";
+}
+
 function handleClose(done) {
   // dialogVisible.value = false;
   ElMessageBox.confirm("是否确定关闭此对话框?")
@@ -72,7 +261,8 @@ function handleClose(done) {
         // catch error
       });
 }
-
+// 富文本
+let richPageRef = ref(null);
 let title = ref("");
 let ruleFormRef = ref(null);
 function initFun(type, row) {
@@ -82,33 +272,62 @@ function initFun(type, row) {
   if (type == "add") {
     title.value = "新增";
     ruleForm.value = {};
+    nextTick(() => {
+      richPageRef.value.valueHtml = "";
+    });
   } else {
     title.value = "编辑";
     ruleForm.value = Object.assign({}, row);
+
+    // 商品封面
+    coverImgList.value = [];
+    if (row.cover) {
+      coverImgList.value.push({
+        url: imgSrc(row.cover),
+      });
+    }
+    // 商品封面
+    picImgList.value = [];
+    if (row.cover) {
+      picImgList.value.push({
+        url: imgSrc(row.pic),
+      });
+    }
+    if (row.content) {
+      nextTick(() => {
+        richPageRef.value.valueHtml = row.content;
+      });
+    } else {
+      nextTick(() => {
+        richPageRef.value.valueHtml = "";
+      });
+    }
   }
   dialogVisible.value = true;
 }
+function imgSrc(path) {
+  return import.meta.env.VITE_APP_BASE_API + path;
+}
 
-const emit = defineEmits(["refreshList"]);
+const emit = defineEmits(["refreshTable"]);
 
 function submit() {
+  ruleForm.value.content =richPageRef.value.valueHtml;
   if (!ruleFormRef.value) return;
   ruleFormRef.value.validate((valid, fields) => {
     if (valid) {
       let obj = Object.assign({}, ruleForm.value);
       if (!ruleForm.value.id) {
-
         addApi(obj).then((data) => {
           ElMessage.success("新增成功！");
           dialogVisible.value = false;
-          emit("refreshList");
+          emit("refreshTable");
         });
       } else {
-        obj.data_specs = JSON.parse(obj.data_specs);
         saveApi(obj).then((data) => {
           ElMessage.success("修改成功！");
           dialogVisible.value = false;
-          emit("refreshList");
+          emit("refreshTable");
         });
       }
     }
@@ -116,8 +335,6 @@ function submit() {
 }
 
 
-
-
 //
 defineExpose({
   initFun,

src/views/customer/manage/components/DrawerCustom.vue

@@ -52,10 +52,9 @@
               <tab10 ref="tab10Ref" :dataInfo="dataInfo" :showItem="showItem" />
             </div>
           </el-tab-pane>
-
-          <el-tab-pane label="商城订单" name="11">
+          <el-tab-pane label="商城订单" name="5">
             <div class="detail-tab-content">
-              <tab11 ref="tab11Ref" :dataInfo="dataInfo" :showItem="showItem" />
+              <tab5 :showItem="showItem" ref="tab5Ref" :customInfo="customInfo" :dataInfo="dataInfo" />
             </div>
           </el-tab-pane>
 
@@ -108,11 +107,7 @@
               <tab4 :showItem="showItem" :customInfo="customInfo" :dataInfo="dataInfo" ref="tab4Ref" />
             </div>
           </el-tab-pane>
-          <el-tab-pane label="商城订单" name="5">
-            <div class="detail-tab-content">
-              <tab5 :showItem="showItem" ref="tab5Ref" :customInfo="customInfo" :dataInfo="dataInfo" />
-            </div>
-          </el-tab-pane>
+
           <el-tab-pane label="回款" name="6">
             <div class="detail-tab-content">
               <tab6 :showItem="showItem" ref="tab6Ref" :customInfo="customInfo" :dataInfo="dataInfo" />
@@ -161,7 +156,6 @@ import tab6 from "./Tab6.vue";
 import tab7 from "./Tab7.vue";
 import tab8 from "./Tab8.vue";
 import tab10 from "./Tab10.vue";
-import tab11 from "./Tab11.vue";
 import tab12 from "./Tab12.vue";
 import tab13 from "./Tab13.vue";
 import tab14 from "./Tab14.vue";

src/views/customer/manage/components/Tab10.vue

@@ -1,35 +1,44 @@
 <template>
   <div class="custom-tab-page">
-    <div class="tab3-title">
-      <div class="manage-shopping-title-left" style="white-space: nowrap">
-        <el-form inline ref="searchFormRef" :model="searchForm"  :rules="rules">
-          <el-form-item>
-            <el-input
-                v-model="searchForm.name"
-                placeholder="金额"
-            ></el-input>
-          </el-form-item>
-          <el-form-item>
-            <el-input
-                v-model="searchForm.type"
-                placeholder="充值类型"
-            ></el-input>
-          </el-form-item>
-          <el-form-item style="width: 180px">
-            <el-button @click="submit">提交</el-button>
-          </el-form-item>
-        </el-form>
-      </div>
-      <div class="manage-shopping-title-right" style="white-space: nowrap">
+    <div class="tab5-title">
+      <el-row>
+        <div class="manage-shopping-title-left" style="white-space: nowrap">
+          <el-form inline ref="searchFormRef" :model="searchForm" :rules="rules">
+            <el-form-item label="充值金额:">
+              <el-input-number v-model="searchForm.money" :min="0" placeholder="金额" />
+            </el-form-item>
+            <el-form-item label="充值类型:">
+              <el-select v-model="searchForm.charge_type" style="width: 180px" clearable placeholder="充值类型">
+                <el-option label="充值" value="充值" />
+                <el-option label="退费" value="退费" />
+              </el-select>
+            </el-form-item>
+            <el-form-item style="width: 180px">
+              <el-button @click="submit">提交</el-button>
+            </el-form-item>
+          </el-form>
+        </div>
+      </el-row>
+      <el-row>
+        <div class="left">
+          <div style="margin-right: 20px">
+            <label>充值总金额：</label>
+            <span>{{ customerInfo.balance_total }}</span>
+          </div>
+          <div>
+            <label>当前余额：</label>
+            <span>￥{{ customerInfo.balance_num }}</span>
+          </div>
+        </div>
+      </el-row>
 
-      </div>
     </div>
     <el-table :data="tableData" border style="width: 100%; margin-top: 15px">
       <el-table-column prop="id" label="ID" />
-      <el-table-column prop="business_budget" label="充值金额(元)" width="130" />
-      <el-table-column prop="bidding_time" label="操作人" width="170" />
-      <el-table-column prop="possibility" label="类型" />
-      <el-table-column prop="project_stage" label="时间" width="200" />
+      <el-table-column prop="money" label="充值金额(元)" width="130" />
+      <el-table-column prop="creator" label="操作人" width="170" />
+      <el-table-column prop="charge_type" label="类型" />
+      <el-table-column prop="created_at" label="时间" width="200" />
     </el-table>
     <div style="display: flex; justify-content: center; margin-top: 10px">
       <el-pagination :small="true" v-model:currentPage="currentPage" v-model:page-size="pageSize"
@@ -40,7 +49,7 @@
 
 </template>
 <script setup>
-import {listApi, delApi, addApi} from "@/plugins/api/customer/manage/opportunity";
+import {listApi, delApi, addApi} from "@/plugins/api/customer/manage/tab10";
 import { useRouter } from "vue-router";
 let router = useRouter();
 const props = defineProps({
@@ -48,6 +57,10 @@ const props = defineProps({
     type: Object,
     default: {},
   },
+  customInfo: {
+    type: Object,
+    default: {},
+  },
   showItem: {
     type: Boolean,
     default: false,
@@ -55,15 +68,22 @@ const props = defineProps({
 });
 let tableData = ref([]);
 let selectData = ref([]);
-let searchForm = ref({});
+let searchForm = ref({
+  customer_id: props.dataInfo.id,
+  charge_type: '充值',
+});
 let rules = {
-  name: [{ required: true, message: "预算金额", trigger: "blur" }],
-  type: [{ required: true, message: "leixing", trigger: "blur" }],
+  created_by: [{ required: true, message: "预算金额", trigger: "blur" }],
+  charge_type: [{ required: true, message: "类型", trigger: "blur" }],
 };
 // 分页
 const currentPage = ref(1);
 const pageSize = ref(20);
 const total = ref(0);
+const customerInfo = ref({
+  balance_total: 0,
+  balance_num: 0,}
+);
 let searchFormRef = ref(null);
 const handleSizeChange = (val) => {
   pageSize.value = val;
@@ -74,14 +94,17 @@ const handleCurrentChange = (val) => {
   getData();
 };
 function getData() {
-
   return new Promise((resolve, reject) => {
     listApi({
       page: currentPage.value,
       pageSize: pageSize.value,
+      customer_id: props.dataInfo.id,
     }).then((res) => {
       tableData.value = res.list;
       total.value = res.page.total;
+      customerInfo.value.balance_total = res.customer.balance_total ? parseFloat(res.customer.balance_total) : 0;
+      customerInfo.value.balance_used = res.customer.balance_used ? parseFloat(res.customer.balance_used) : 0;
+      customerInfo.value.balance_num = customerInfo.value.balance_total - customerInfo.value.balance_used;
       resolve(res);
     });
   });
@@ -93,35 +116,28 @@ function submit() {
   if (!searchFormRef.value) return;
   searchFormRef.value.validate((valid, fields) => {
     if (valid) {
-      let obj = { ...searchForm.value };
-      addApi(obj).then((data) => {
-        ElMessage.success("操作成功！");
-        dialogVisible.value = false;
-        emit("refreshList");
-      });
+      ElMessageBox.confirm("确认充值，是否继续?", "提示", {
+        confirmButtonText: "确认",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+          .then(() => {
+            let obj = { ...searchForm.value };
+            addApi(obj).then((data) => {
+              ElMessage.success("操作成功！");
+              refreshList()
+            });
+          })
+          .catch(() => {
+            ElMessage({
+              type: "info",
+              message: "已取消。",
+            });
+          });
     }
   });
 }
-// 增加
-let addPageRef = ref(null);
-function addFun() {
-  addPageRef.value.initFun("add");
-}
-// 编辑
-function openUpdate(row) {
-  addPageRef.value.initFun("update", row);
-}
-// 查看
-let detailPageRef = ref(null);
-function detailFun(row) {
-  detailPageRef.value.initFun(row);
-  //   router.push({
-  //     path: "/custom/opportunity/detail",
-  //     query: {
-  //       oppoInfo: JSON.stringify(row),
-  //     },
-  //   });
-}
+
 
 // 删除
 function delFun(row) {
@@ -165,32 +181,31 @@ onMounted(() => { });
 .custom-tab-page {
   width: 100%;
 
-  .tab3-title {
-    display: flex;
-    justify-content: space-between;
-    height: 46px;
+  .tab5-title {
+    height: 70px;
     background: #fafbfc;
     box-sizing: border-box;
-    padding-right: 10px;
-
-    .left {
+    padding-left: 10px;
+    justify-content: space-between;
+    >div {
       align-self: center;
-      font-size: 14px;
-      font-weight: bold;
-      color: #172b4d;
-      position: relative;
-      padding-left: 7px;
+      margin-right: 20px;
 
-      &::before {
-        content: "";
-        width: 2px;
-        height: 15px;
-        background: #005ecc;
-        position: absolute;
-        left: 0;
-        top: 50%;
-        transform: translateY(-50%);
+      label {
+        font-size: 14px;
+        font-weight: 500;
+        color: #5e6c84;
       }
+
+      span {
+        font-size: 14px;
+        font-weight: 500;
+        color: #005ecc;
+      }
+    }
+
+    .left {
+      display: flex;
     }
 
     .right {