福利宝客服

components/controller/index.ts

@@ -16,5 +16,11 @@ export function parserMessage(type: string, rawMsg: string) {
     if (type === MessageType.Withdraw) {
         return `[撤回了一条消息]`;
     }
+    if (type === MessageType.MyPurchasePlan) {
+        return `[我的采购计划]`;
+    }
+    if (type === MessageType.MyWelfare) {
+        return `[我的福利]`;
+    }
     return `[系统自动回复]`;
 }

components/css/benefits-plan.less

-/deep/.benefits-plan-message, /deep/.benefits-welfare-message{
+/deep/.benefits-plan-message,
+/deep/.benefits-welfare-message {
     white-space: normal;
-    .my-plan,.my-welfare{
-        color: #E84929;
+    .my-plan,
+    .my-welfare {
+        color: #e84929;
         margin-bottom: 10px;
     }
-    .item-title{
+}
+/deep/.benefits-plan-message {
+    .plan-title-wrap {
+        display: flex;
+        justify-content: space-between;
+        margin-bottom: 4px;
+        .total-price {
+            color: #e84929;
+        }
+        .item-title {
+            max-width: 185px;
+            color: #373737;
+            font-size: 14px;
+            font-weight: bold;
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            text-decoration: underline;
+            margin-right: 8px;
             cursor: pointer;
+        }
+    }
+
+    .prodoct-item {
+        display: flex;
+        padding: 16px 0;
+        &:not(:last-child) {
+            border-bottom: 1px dashed #ededed;
+        }
+        img {
+            width: 50px;
+            height: 50px;
+            margin-right: 10px;
+        }
+        .product-detail {
+            display: flex;
+            flex-direction: column;
+            justify-content: space-between;
+            flex: 1;
+            .product-name {
+                word-break: break-all;
+                overflow: hidden;
+                text-overflow: ellipsis;
+                display: -webkit-box;
+                -webkit-line-clamp: 2;
+                -webkit-box-orient: vertical;
+            }
+            .price-nums{
+                display: flex;
+                justify-content: space-between;
+            }
+        }
+    }
+}
+/deep/.benefits-welfare-message {
+    .item-title {
+        font-weight: bold;
+        margin-bottom: 10px;
         text-decoration: underline;
+        cursor: pointer;
     }
 }

components/message-item/my-welfare-message.vue

+<template>
+    <div
+        class="msg-detail inline-text"
+        v-html="messageBody.msg.text || emptyText"
+    ></div>
+</template>
+
+<script lang="ts">
+    import { Component } from "vue-property-decorator";
+    import BaseMessage from "./index";
+
+    @Component({ components: {} })
+    export default class Index extends BaseMessage {
+        private readonly emptyText = "　";
+    }
+</script>
+
+<style lang="less" scoped>
+    .inline-text {
+        display: inline-block;
+        white-space: pre-wrap;
+        text-align: left;
+    }
+</style>
\ No newline at end of file

components/message-item/purchase-plan-message.vue

+<template>
+    <div
+        class="msg-detail inline-text"
+        v-html="messageBody.msg.text || emptyText"
+    ></div>
+</template>
+
+<script lang="ts">
+    import { Component } from "vue-property-decorator";
+    import BaseMessage from "./index";
+
+    @Component({ components: {} })
+    export default class Index extends BaseMessage {
+        private readonly emptyText = "　";
+    }
+</script>
+
+<style lang="less" scoped>
+    .inline-text {
+        display: inline-block;
+        white-space: pre-wrap;
+        text-align: left;
+    }
+</style>
\ No newline at end of file

components/message.vue

@@ -134,6 +134,8 @@
     import VideoMessage from "./message-item/video-message.vue";
     import TextMessage from "./message-item/text-message.vue";
     import WithdrawMessage from "./message-item/withdraw-message.vue";
+    import PurchasePlanMessage from "./message-item/purchase-plan-message.vue";
+    import MyWelfareMessage from "./message-item/my-welfare-message.vue";
     import xim from "./../xim";
 
     const twoMinutes = 2 * 60 * 1000;
@@ -146,6 +148,8 @@
         [dto.MessageType.Text, "text-message"],
         [dto.MessageType.Withdraw, "withdraw-message"],
         [dto.MessageType.GeneralOrderMsg, "text-message"],
+        [dto.MessageType.MyPurchasePlan, "purchase-plan-message"],
+        [dto.MessageType.MyWelfare, "my-welfare-message"],
     ]);
 
     @Component({
@@ -158,6 +162,8 @@
             VideoMessage,
             TextMessage,
             WithdrawMessage,
+            PurchasePlanMessage,
+            MyWelfareMessage
         },
     })
     export default class Message extends Vue {

model/index.ts

@@ -98,6 +98,8 @@ export const enum MessageType {
     Voice = "voice",
     GeneralOrderMsg = "general_order_msg",
     Withdraw = "withdraw",
+    MyPurchasePlan = "my_purchase_plan",
+    MyWelfare = "my_welfare",
 }
 
 export const enum MessageHandled {