From 93fc6016eff9e49d5128dec4968c5d59751f99fc Mon Sep 17 00:00:00 2001
From: lihui <lihui030304@163.com>
Date: Sat, 5 Jul 2025 14:09:06 +0800
Subject: [PATCH] =?UTF-8?q?refactor(consume):=20=E4=BC=98=E5=8C=96?=
 =?UTF-8?q?=E5=AE=A2=E6=88=B7=E4=BF=A1=E6=81=AF=E5=B1=95=E7=A4=BA=E5=B8=83?=
 =?UTF-8?q?=E5=B1=80=E5=92=8C=E6=8F=90=E7=A4=BA=E6=B6=88=E6=81=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 调整客户信息卡片样式，优化布局结构
- 将错误提示改为警告提示，提高用户体验
---
 src/views/consume/addCoinConsume.vue | 74 +++++++++++++++++++++---------------
 1 file changed, 44 insertions(+), 30 deletions(-)

diff --git a/src/views/consume/addCoinConsume.vue b/src/views/consume/addCoinConsume.vue
index 7ed9c5e..c07cbf4 100644
--- a/src/views/consume/addCoinConsume.vue
+++ b/src/views/consume/addCoinConsume.vue
@@ -105,13 +105,13 @@ function validateInput() {
   trimJwCode();
 
   if (user.value.jwcode == null) {
-    ElMessage.error("请先查询用户信息");
+    ElMessage.warning("请先查询用户信息");
     addConsume.value.sumGold = null;
     return false;
   }
   // 验证金币数值
   if (user.value.jwcode && (isNaN(sumGold) || sumGold <= 0)) {
-    ElMessage.error("消费金币总数必须是大于0的数字");
+    ElMessage.warning("消费金币总数必须是大于0的数字");
     // 将sumGold设置为null
     addConsume.value.sumGold = null;
     return false;
@@ -308,7 +308,7 @@ const getUser = async function (jwcode) {
       user.value.historyTaskGold = (result.data.historyTaskGold) / 100;
     }
     if (result.code === 0) {
-      ElMessage.error(result.msg);
+      ElMessage.warning("请检查查询参数")
     } else if (result.data === null) {
       ElMessage.error("用户不存在");
     } else {
@@ -408,7 +408,7 @@ onMounted(async function () {
       </el-form-item>
 
       <div style="display: flex; align-items: center; gap: 20px;">
-        <el-form-item prop="productName" label="商品名称" style="flex: 1; margin-right: 0px">
+        <el-form-item prop="goodsName" label="商品名称" style="flex: 1; margin-right: 0px">
 
           <el-select
               v-model="addConsume.goodsName"
@@ -496,53 +496,65 @@ onMounted(async function () {
       <el-button type="primary" @click="addBefore"> 提交</el-button>
     </el-form>
 
+
     <!-- 客户信息栏 -->
-    <el-card v-if="user.jwcode" style="width: 950px; float: right" class="customer-info">
+    <el-card v-if="user.jwcode" style="width: 800px; float: right" class="customer-info">
       <el-form
           :model="user"
           label-width="auto"
-          style="max-width: 1200px"
+          style="max-width: 1000px"
           label-position="left"
       >
         <el-text size="large" style="margin-left: 20px">客户信息</el-text>
+
+        <!-- 第一行：姓名 + 历史金币 -->
         <el-row style="margin-top: 20px">
-          <el-col :span="10">
-            <el-form-item label="姓名:">
+          <el-col :span="9">
+            <el-form-item label="姓名">
               <p>{{ user.name }}</p>
             </el-form-item>
           </el-col>
           <el-col :span="14">
             <el-form-item label="历史金币总数">
-              <p>{{ user.historySumGold }}</p>
-
+              <p v-if="!isNaN(Number(user.historySumGold))">
+                {{ Number(user.historySumGold) }}
+              </p>
             </el-form-item>
           </el-col>
-          <el-col :span="10">
+        </el-row>
+
+        <!-- 第二行：精网号 + 当前金币（独立行） -->
+        <el-row>
+          <el-col :span="9">
             <el-form-item label="精网号">
               <p>{{ user.jwcode }}</p>
             </el-form-item>
           </el-col>
           <el-col :span="14">
-            <el-form-item label="当前金币总数" style="width: 600px">
-            <span
-                style="color: #2fa1ff; margin-right: 5px"
-                v-if="user.nowSumGold !== undefined"
-            >
-              {{ user.nowSumGold }}</span
-            >
+            <el-form-item label="当前金币总数" style="width: 500px">
+          <span
+              style="color: #2fa1ff; margin-right: 5px"
+              v-if="user.nowSumGold !== undefined"
+          >{{ user.nowSumGold }}</span>
+            </el-form-item>
+            <!-- 金币详情独立显示 -->
+            <el-form-item style="margin-top: -23px">  <!-- 负边距减少间距 -->
               <span
-                  style="display: inline; white-space: nowrap; color: #b1b1b1"
-                  v-if="user.nowSumGold !== null "
-              >(永久金币:{{ user.nowPermanentGold }};免费金币:{{
-                  (user.nowFreeGold)
-                }};任务金币:{{ user.nowTaskGold }})</span>
-
+                  style="color: #b1b1b1; margin-left: 0px"
+                  v-if="user.nowPermanentGold !== undefined"
+              >(永久金币:{{ user.nowPermanentGold }};
+            免费金币:{{ user.nowFreeGold }};
+            任务金币:{{ user.nowTaskGold }})</span>
             </el-form-item>
           </el-col>
-          <el-col :span="10">
+        </el-row>
+
+        <!-- 第三行：首次充值日期 + 充值次数 -->
+        <el-row style="margin-top:-23px">
+          <el-col :span="9">
             <el-form-item label="首次充值日期">
               <p v-if="user.firstRecharge">
-                {{ moment(user.firstRecharge).format("YYYY-MM-DD HH:mm:ss") }}
+                {{ moment(user.firstRecharge).format('YYYY-MM-DD HH:mm:ss') }}
               </p>
             </el-form-item>
           </el-col>
@@ -551,18 +563,20 @@ onMounted(async function () {
               <p style="color: #2fa1ff">{{ user.rechargeNum }}</p>
             </el-form-item>
           </el-col>
-          <el-col :span="10">
+        </el-row>
+
+        <!-- 第四行：消费次数 + 所属门店 -->
+        <el-row>
+          <el-col :span="9">
             <el-form-item label="消费次数">
               <p style="color: #2fa1ff">{{ user.consumeNum }}</p>
             </el-form-item>
           </el-col>
-          <el-col :span="10">
+          <el-col :span="9">
             <el-form-item label="所属门店">
               <p>{{ user.market }}</p>
             </el-form-item>
           </el-col>
-          <el-col :span="14">
-          </el-col>
         </el-row>
       </el-form>
     </el-card>