Browse Source

feat: 升级情况下,规格旁边添加提示

cuiyalong 1 month ago
parent
commit
58e158a12e

+ 32 - 11
src/views/create-order/components/product-info-submodule/RadioGroup.vue

@@ -1,15 +1,18 @@
 <template>
-  <el-radio-group class="c-radio-group" :value="value" @input="onRadioInput">
-    <el-radio
-      v-for="item in calcOptions"
-      v-show="calcShow(item)"
-      :disabled="item.disabled || disabled"
-      :key="item.value"
-      @click.native="handleRadioClick(item)"
-      :label="item.value">
-      <span v-html="item.label"></span>
-    </el-radio>
-  </el-radio-group>
+  <div class="radio-group-container">
+    <el-radio-group class="c-radio-group" :value="value" @input="onRadioInput">
+      <el-radio
+        v-for="item in calcOptions"
+        v-show="calcShow(item)"
+        :disabled="item.disabled || disabled"
+        :key="item.value"
+        @click.native="handleRadioClick(item)"
+        :label="item.value">
+        <span v-html="item.label"></span>
+      </el-radio>
+    </el-radio-group>
+    <div class="message-tip" v-if="canShowMessageTip">{{ messageTipText }}</div>
+  </div>
 </template>
 
 <script>
@@ -32,6 +35,14 @@ export default {
       type: Boolean,
       default: false
     },
+    messageTipText: {
+      type: String,
+      default: '注:升级后最终的产品规格'
+    },
+    showMessageTip: {
+      type: Boolean,
+      default: false
+    },
     options: {
       type: Array,
       default() {
@@ -51,6 +62,9 @@ export default {
   computed: {
     calcOptions() {
       return this.options.filter(r => !r.hide)
+    },
+    canShowMessageTip() {
+      return this.showMessageTip && this.messageTipText
     }
   },
   methods: {
@@ -98,4 +112,11 @@ export default {
     }
   }
 }
+
+.message-tip {
+  color: $red_deep;
+  margin-top: -6px;
+  line-height: 22px;
+  font-size: 13px;
+}
 </style>

+ 3 - 1
src/views/create-order/components/product-info-submodule/ServiceList.vue

@@ -891,8 +891,10 @@ export default {
   font-weight: bold;
 }
 .upgrade-text {
-  margin-top: -12px;
+  margin-top: -6px;
   margin-left: 92px;
+  font-size: 13px;
+  line-height: 22px;
 }
 .service-list-group {
   display: inline-block;

+ 3 - 0
src/views/create-order/components/schema-form/schema-form.vue

@@ -1232,6 +1232,7 @@ export default {
       if (!ma) {
         return console.error('没找到schema: ', schemaKeyMap.specification)
       }
+      this.$set(ma.props, 'showMessageTip', false)
       // 启用所有规格
       this.cjdyChangeSpecificationSchema()
       // 1付费类型为“续费”,默认为关联订单的产品规格,不支持修改;
@@ -1254,6 +1255,8 @@ export default {
         // 2付费类型为“升级”且“升级内容”仅为“增购子账号”,默认为关联订单的产品规格,其他产品规格不展示;
         // 3付费类型为“升级”且“升级内容”有“补充服务”或为空,仅可选择不低于关联订单的产品规格(注:特殊处理,大会员自定义版默认展示),其他产品规格不展示。
         this.$set(ma.props, 'onlyShowSelected', false)
+        this.$set(ma.props, 'showMessageTip', true)
+        
         // 1补充服务  2增购子账号
         if (upgradeContent.length === 1 && upgradeContent.includes(2)) {
           // 仅为增购子账号:默认为关联订单的产品规格,其他产品规格不展示;