Browse Source

完善专区余额模块配置

csk 3 weeks ago
parent
commit
39266e2efa

+ 3 - 3
工作空间/产研/权益/汇丰全行/产品原型/pc-demo/src/mock/index.js

@@ -91,21 +91,21 @@ const zoneConfigData = {
       bgImage: 'https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?w=800',
       showAvgBalance: true,
       avgBalanceName: '账户月内日均余额',
-      avgBalanceRule: '<p>月内日均余额 = 当月内每日账户余额之和 / 当月天数。</p>'
+      avgBalanceRule: '<p>1.指从当月第一天起到截止日期为止,同一客户号码下所有账户月内日均总余额。</p><p>2. 计算公式=当月第一天到截止日期的累计账户总余额当月已过的自然天数。</p>'
     },
     premier: {
       bgImage: 'https://images.unsplash.com/photo-1583847268964-b28dc8f51f92?w=800',
       showAvgBalance: true,
       avgBalanceName: '账户月内日均余额',
       identityTipContent: '<p>卓越理财客户身份由客户 MSC Group 自动匹配展示。</p>',
-      avgBalanceRule: '<p>计算规则:截止到昨日的账户月内日均余额。</p>'
+      avgBalanceRule: '<p>1.指从当月第一天起到截止日期为止,同一客户号码下所有账户月内日均总余额。</p><p>2. 计算公式=当月第一天到截止日期的累计账户总余额当月已过的自然天数。</p>'
     },
     premierElite: {
       bgImage: 'https://images.unsplash.com/photo-1557682250-33bd709cbe85?w=800',
       showAvgBalance: true,
       avgBalanceName: '账户月内日均余额',
       identityTipContent: '<p>卓越理财·尊尚客户身份由客户 MSC Group 自动匹配展示。</p>',
-      avgBalanceRule: '<p>计算规则:截止到昨日的账户月内日均余额。</p>'
+      avgBalanceRule: '<p>1.指从当月第一天起到截止日期为止,同一客户号码下所有账户月内日均总余额。</p><p>2. 计算公式=当月第一天到截止日期的累计账户总余额当月已过的自然天数。</p>'
     },
     privateBank: {
       bgImage: 'https://images.unsplash.com/photo-1492684223066-81342ee5ff30?w=800',

+ 54 - 8
工作空间/产研/权益/汇丰全行/产品原型/pc-demo/src/views/PageZoneConfig.vue

@@ -53,6 +53,14 @@
           </div>
         </div>
 
+        <div v-if="m.key !== 'privateBank'" class="identity-row balance-module-switch">
+          <div class="identity-field-label">账户余额模块</div>
+          <el-checkbox
+            v-model="configData.identityModule[m.key].showAvgBalance"
+            @change="markModified"
+          >展示</el-checkbox>
+        </div>
+
         <!-- 日均余额计算规则说明 -->
         <div
           v-if="m.key !== 'privateBank' && configData.identityModule[m.key].showAvgBalance"
@@ -90,6 +98,16 @@
               />
             </div>
           </div>
+          <div v-if="m.key === 'premier'" class="config-field">
+            <div class="config-field-label">补充说明</div>
+            <el-input
+              v-model="configData.identityModule[m.key].avgBalanceSupplementNote"
+              maxlength="20"
+              placeholder="请输入"
+              class="balance-name-input"
+              @input="markModified"
+            />
+          </div>
         </div>
       </div>
     </el-card>
@@ -234,13 +252,16 @@
           </el-button>
         </div>
         <div class="exchange-body">
-          <div class="exchange-image" @click="triggerUpload('exchange', index)">
-            <img v-if="item.imageUrl" :src="item.imageUrl" class="preview-img-sq" />
-            <div v-else class="upload-placeholder-sm">
-              <el-icon><Picture /></el-icon>
-              <span>未上传</span>
+          <div class="exchange-image-wrap">
+            <div class="exchange-image" @click="triggerUpload('exchange', index)">
+              <img v-if="item.imageUrl" :src="item.imageUrl" class="preview-img-sq" />
+              <div v-else class="upload-placeholder-sm">
+                <el-icon><Picture /></el-icon>
+                <span>未上传</span>
+              </div>
+              <input :ref="'exchangeUpload' + index" type="file" accept="image/*" style="display:none" @change="onImageUpload($event, 'exchange', index)" />
             </div>
-            <input :ref="'exchangeUpload' + index" type="file" accept="image/*" style="display:none" @change="onImageUpload($event, 'exchange', index)" />
+            <div class="exchange-image-tip">必填,建议尺寸:<br/>210 * 119 px</div>
           </div>
           <el-form label-width="80px" inline class="exchange-fields">
             <el-form-item>
@@ -323,6 +344,8 @@ import { ElMessage, ElMessageBox } from 'element-plus'
 import request from '@/utils/request'
 import { fetchLinkOptions } from '@/utils/linkOptions'
 
+const DEFAULT_AVG_BALANCE_RULE = '<p>1.指从当月第一天起到截止日期为止,同一客户号码下所有账户月内日均总余额。</p><p>2. 计算公式=当月第一天到截止日期的累计账户总余额当月已过的自然天数。</p>'
+
 export default {
   name: 'PageZoneConfig',
   data() {
@@ -406,7 +429,8 @@ export default {
         showAvgBalance: true,
         avgBalanceName: '账户月内日均余额',
         avgBalancePopupTitle: '',
-        avgBalanceRule: '<p></p>'
+        avgBalanceRule: DEFAULT_AVG_BALANCE_RULE,
+        avgBalanceSupplementNote: ''
       }
       return {
         advance: { ...base },
@@ -564,6 +588,9 @@ export default {
         }
       }
       for (const [index, item] of (this.configData.exchangeConfig?.items || []).entries()) {
+        if (this.isBlank(item.imageUrl)) {
+          return this.showSaveError(`常用兑换配置-第 ${index + 1} 个-图片未上传`)
+        }
         if (this.isBlank(item.title)) {
           return this.showSaveError(`常用兑换配置-第 ${index + 1} 个-展示文字未填写`)
         }
@@ -773,8 +800,9 @@ export default {
 }
 
 .exchange-body { display: flex; align-items: flex-start; gap: 16px; margin-top: 8px; }
+.exchange-image-wrap { flex-shrink: 0; }
 .exchange-image {
-  width: 80px; height: 80px; flex-shrink: 0;
+  width: 126px; height: 71px; flex-shrink: 0;
   background: #eef6fc; border: 1px solid #dcdfe6; border-radius: 4px;
   display: flex; align-items: center; justify-content: center;
   cursor: pointer; overflow: hidden;
@@ -785,6 +813,13 @@ export default {
   color: #c0c4cc; font-size: 10px;
 }
 .upload-placeholder-sm i { font-size: 18px; }
+.exchange-image-tip {
+  font-size: 10px;
+  color: #909399;
+  text-align: center;
+  line-height: 1.35;
+  margin-top: 6px;
+}
 .exchange-fields { flex: 1; margin-top: 8px; }
 
 .empty-tip {
@@ -822,6 +857,17 @@ export default {
 .identity-field-label {
   font-size: 13px; color: #606266; margin-bottom: 6px;
 }
+.balance-module-switch {
+  display: flex;
+  align-items: center;
+  gap: 18px;
+}
+.balance-module-switch .identity-field-label {
+  margin-bottom: 0;
+}
+.balance-module-switch :deep(.el-checkbox) {
+  height: 24px;
+}
 .muted { color: #909399; font-weight: normal; font-size: 12px; }
 .bg-upload-area {
   display: flex; align-items: center; gap: 16px;