From 6a0bc7efb58bae4360ce068d27279916b2eb59fc Mon Sep 17 00:00:00 2001
From: lihui <lihui030304@163.com>
Date: Tue, 19 Aug 2025 11:07:07 +0800
Subject: [PATCH] =?UTF-8?q?fix=EF=BC=9A=E5=90=88=E5=B9=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/consume/gold/addCoinConsume.vue | 204 ++++++++++++++++++++++++++----
 1 file changed, 181 insertions(+), 23 deletions(-)

diff --git a/src/views/consume/gold/addCoinConsume.vue b/src/views/consume/gold/addCoinConsume.vue
index c2ea7c8..4f4502a 100644
--- a/src/views/consume/gold/addCoinConsume.vue
+++ b/src/views/consume/gold/addCoinConsume.vue
@@ -1,12 +1,14 @@
 <script setup>
-import { onMounted, reactive, ref, watch } from "vue";
-import { ElMessage, ElMessageBox } from "element-plus";
+import {onMounted, reactive, ref, watch} from "vue";
+import {ElIcon, ElMessage, ElMessageBox} from "element-plus";
 import moment from "moment";
 import request from "@/util/http.js"
 import Cookies from 'js-cookie';
+import {useAdminStore} from "@/store/index.js";
+import {storeToRefs} from "pinia";
+import {WarnTriangleFilled} from "@element-plus/icons-vue";
 import dayjs from "dayjs";
-import { useAdminStore } from "@/store/index.js";
-import { storeToRefs } from "pinia";
+
 const adminStore = useAdminStore();
 const { adminData, menuTree } = storeToRefs(adminStore);
 // 精网号去空格
@@ -30,7 +32,7 @@ const addDisabled = ref(false)
 ====================数据=================================
 */
 //这是获取当前登录的用户信息
-const adminData = ref({});
+// const adminData = ref({});
 
 // 通过精网号查询用户（客户）信息 表单
 const user = ref({
@@ -233,7 +235,14 @@ function calculateCoins(sumGold) {
 
   return { free: freeUsed, permanent: permanentUsed, task: taskUsed };
 }
-
+// 用来写的 cookie 的 key
+const WriteCookies = ref(null)
+// 用来写的 cookie 的 value
+const WriteCookiesTime = ref(null)
+// 用来读的 cookie 的 key
+const ReadCookies = ref(null)
+// 用来读的 cookie 的 value
+const ReadCookiesTime = ref(null)
 // 这是添加消费信息的接口
 const add = async function () {
   try {
@@ -245,6 +254,17 @@ const add = async function () {
     calculateCoins(addConsume.value.sumGold);
 
     console.log("addConsume.value", addConsume.value)
+
+    //存一下 用户的jwcode
+    // 拼接 jwcode:permanentGold:freeGold
+    WriteCookies.value = `coinConsume:${addConsume.value.jwcode}:${addConsume.value.goodsName}}`
+    //value 为当前消耗时间
+    WriteCookiesTime.value = dayjs().format("YYYY-MM-DD HH:mm:ss");
+    // 设置cookies,用户jwcode为key，value也是jwcode，过期时间为1天
+    Cookies.set(WriteCookies.value, WriteCookiesTime.value, {expires:
+          1, path: '/'});
+
+    addDisabled.value = true
     // 发送POST请求
     const result = await request({
       // url: "/consume/add",
@@ -261,7 +281,7 @@ const add = async function () {
         remark: addConsume.value.remark
       }
     });
-
+    addDisabled.value = false
     console.log("add请求", result);
     // 处理响应
     handleResponse(result);
@@ -321,30 +341,66 @@ function resetForm() {
     nowSumGold: null
   }
 }
+// 充值对话框显示状态
+const ConsumeDialogVisible = ref(false);
+
+// 关闭对话框
+const ConsumeDialogVisiblehandleClose = () => {
+  ConsumeDialogVisible.value = false;
+  // 重置表单数据
+  resetForm()
+  user.value = {}
+};
+
+// 确认使用cookie继续充值
+const ConsumeDialogVisibleContinue = () => {
+  ConsumeDialogVisible.value = false;
+  add();
+};
+
+const ConsumeDialogVisibleCancel = () => {
+  ConsumeDialogVisible.value = false
+  resetForm()
+  user.value = {}
+};
+// 实际执行充值操作
+const proceedWithConsume = () => {
+  ElMessageBox.confirm('确认充值？')
+      .then(() => {
+        add();
+        console.log('添加成功');
+      })
+      .catch(() => {
+        console.log('取消添加');
+      });
+};
 
 // 添加前验证
 const addBefore = () => {
   Ref.value.validate(async (valid) => {
-    if (valid) {
-      ElMessageBox.confirm("确认添加？")
-        .then(() => {
-          console.log("这里是jwcode", addConsume.value.jwcode)
-          add();
-          console.log("添加成功",);
-          addConsume.value = {};
-        })
-        .catch(() => {
-          console.log("取消添加");
-        });
-    } else {
-      //提示
+    // 验证cookie
+    if (!valid) {
       ElMessage({
-        type: "error",
-        message: "请检查输入内容",
+        type: 'error',
+        message: '请检查输入内容'
       });
+      return;
+    }
+    ReadCookies.value = `coinConsume:${addConsume.value.jwcode}:${addConsume.value.goodsName}}`
+    // 获取cookie
+    const cookie = Cookies.get(ReadCookies.value)
+    console.log("time", WriteCookiesTime.value)
+    // 格式化时间
+    ReadCookiesTime.value = moment(cookie).format('YYYY-MM-DD HH:mm:ss')
+    if (cookie) {
+      ConsumeDialogVisible.value = true;
+    } else {
+      proceedWithConsume();
     }
   });
 };
+
+
 // 查询客户信息（通过精网号）
 const getUser = async function (jwcode) {
   try {
@@ -522,7 +578,7 @@ onMounted(async function () {
         </el-form-item>
       </div>
       <el-button type="success" @click="resetForm()" style="margin-left: 200px;margin-top:10px">重置</el-button>
-      <el-button type="primary" @click="addBefore" style="margin-top:10px"> 提交</el-button>
+      <el-button type="primary" :disabled="addDisabled" @click="addBefore" style="margin-top:10px"> 提交</el-button>
     </el-form>
 
 
@@ -610,7 +666,79 @@ onMounted(async function () {
         </el-row>
       </el-form>
     </el-card>
+    <el-dialog
+        v-model="ConsumeDialogVisible"
+        title="操作确认"
+        :before-close="ConsumeDialogVisiblehandleClose"
+        :close-on-click-modal="false"
+        width="480px"
+    >
+      <!-- 内容整体居中且收窄 -->
+      <div class="confirm-body">
+        <!-- 用户信息 -->
+        <div>
+          <div class="field-label">用户信息</div>
+          <el-input :model-value="user.jwcode + (user.name ? '【' + user.name + '】' : '')" disabled/>
+        </div>
+        <!-- 活动名称 -->
+        <div class="field">
+          <div class="field-label">商品名称</div>
+          <el-input v-model="addConsume.goodsName" disabled/>
+        </div>
+        <!--金币总数   -->
+        <div class="field">
+          <div class="field-label">金币总数</div>
+          <el-input v-model="addConsume.sumGold" disabled/>
+        </div>
+        <!-- 金币详细信息（同一行左右排列） -->
+        <el-row :gutter="20" class="coins-row">
+          <el-col :span="8">
+            <div class="field">
+              <div class="field-label">永久金币</div>
+              <el-input v-model="addConsume.permanentGold" disabled/>
+            </div>
+          </el-col>
+          <el-col :span="8">
+            <div class="field">
+              <div class="field-label">免费金币</div>
+              <el-input v-model="addConsume.freeGold" disabled/>
+            </div>
+          </el-col>
+          <el-col :span="8">
+            <div class="field">
+              <div class="field-label">任务金币</div>
+              <el-input v-model="addConsume.taskGold" disabled/>
+            </div>
+          </el-col>
 
+        </el-row>
+        <!-- 风险提示 -->
+        <div style="display: flex; align-items: center; margin-top: 20px;">
+          <el-icon :size="24" color="#FFD700">
+            <WarnTriangleFilled/>
+          </el-icon>
+          <p>重复购买风险提示</p>
+        </div>
+        <!-- 记录 + 虚线分隔 -->
+        <div>
+          <el-divider border-style="dashed"/>
+          <p>检测到该用户近期有相似消费记录：</p>
+          · {{ ReadCookiesTime }} 购买 【{{ addConsume.goodsName }}】(操作人: {{ adminData.adminName }})
+        </div>
+        <div style="margin-top: 10px">
+          <p>是否继续操作？</p>
+
+        </div>
+      </div>
+
+      <!-- 底部按钮（居中） -->
+      <template #footer>
+        <div class="dialog-footer-center">
+          <el-button @click="ConsumeDialogVisibleCancel">取 消</el-button>
+          <el-button type="primary" @click="ConsumeDialogVisibleContinue">确认充值</el-button>
+        </div>
+      </template>
+    </el-dialog>
   </div>
 
   <!-- 金币消耗明细的布局------------------------------------------------------- -->
@@ -640,4 +768,34 @@ p {
 </style>
 
 <style>
+/* 标题居中 */
+.el-dialog__header {
+  text-align: center;
+}
+.confirm-body {
+  width: 420px;
+  margin: 0 auto;
+}
+/* 字段块与标签样式 */
+.field {
+  margin-bottom: 14px;
+}
+
+.field-label {
+  font-size: 14px;
+  color: #606266;
+  margin-bottom: 6px;
+}
+
+/* 金币行紧凑 */
+.coins-row .field {
+  margin-bottom: 0;
+}
+
+/* 底部按钮居中 */
+.dialog-footer-center {
+  display: flex;
+  justify-content: center;
+  gap: 12px;
+}
 </style>
\ No newline at end of file