feat: 帮助用户订阅--近3个月->近15天

apps/bigmember_pc/src/views/subscribe/FreeConfig.vue

@@ -1,25 +1,42 @@
 <template>
   <div class="free-config-setting-container">
-
-    <div class='config-title flex flex-(row items-center)'>
+    <div class="config-title flex flex-(row items-center)">
       <h1>帮用户订阅（免费订阅）</h1>
-      <div class='flex flex-(row items-center)'>
+      <div class="flex flex-(row items-center)">
         <span>选择用户身份：</span>
-        <div class='select-selector-fix-height'>
-          <select-selector type='select' :options='userKeyList' v-model='checkUserKey' @change='doChangeUserKey' placeholder='请选择用户身份'></select-selector>
+        <div class="select-selector-fix-height">
+          <select-selector
+            type="select"
+            :options="userKeyList"
+            v-model="checkUserKey"
+            @change="doChangeUserKey"
+            placeholder="请选择用户身份"
+          ></select-selector>
         </div>
       </div>
     </div>
 
-    <div v-loading='pageLoading'>
+    <div v-loading="pageLoading">
       <!-- 订阅设置 -->
-      <free-sub-config :datas="setData" :can-select='setData.canSelectArea' :setStatus="setStatus" @update="getUpdate"></free-sub-config>
+      <free-sub-config
+        :datas="setData"
+        :can-select="setData.canSelectArea"
+        :setStatus="setStatus"
+        @update="getUpdate"
+      ></free-sub-config>
       <!-- 关键词设置 -->
-      <free-key-config id="setkey" :datas="setData" :setStatus="setStatus" @update="getUpdate"></free-key-config>
+      <free-key-config
+        id="setkey"
+        :datas="setData"
+        :setStatus="setStatus"
+        @update="getUpdate"
+      ></free-key-config>
       <!-- 关键词列表 -->
       <key-list
         v-if="setData.keyList.length > 0"
         ref="keyConfigRef"
+        matchTimeText="15天"
+        noSpaceWhenClickRecommend
         :datas="setData"
         :setStatus="setStatus"
       ></key-list>
@@ -58,7 +75,12 @@ import { Dialog, Button } from 'element-ui'
 import FreeSubConfig from './components/key/FreeSubConfig'
 import FreeKeyConfig from './components/key/FreeKeyConfig'
 import KeyList from './components/key/List'
-import { getFreeUserSubscribeList, setUserInfoVip, updateKey, getHelpFreeUserKeyList } from '@/api/modules'
+import {
+  getFreeUserSubscribeList,
+  setUserInfoVip,
+  updateKey,
+  getHelpFreeUserKeyList
+} from '@/api/modules'
 import $bus from '@/utils/bus'
 import { mixinNoOpenSetMessage } from '@/utils/mixins/subscribe-setting-prompt.js'
 import { getOneLevelNamesByValues } from '@/assets/js/selector'
@@ -126,7 +148,7 @@ export default {
         confirmButtonColor: '#2ABDD1',
         showClose: false,
         center: true,
-        callback: action => {
+        callback: (action) => {
           history.back()
         }
       })
@@ -141,47 +163,49 @@ export default {
     setTimeout(this.scrollToId, 100)
   },
   methods: {
-    getHelpUserList () {
+    getHelpUserList() {
       getHelpFreeUserKeyList({
-        phone: this.$route.query.phone,
-      }).then(res => {
-        if (res.data && Array.isArray(res.data) && res.data.length > 0) {
-          this.userKeyList = res.data.map(item => {
-            if (item.checked) {
-              this.doChangeUserKey(item.token)
-            }
-            return {
-              label: item.name,
-              value: item.token
+        phone: this.$route.query.phone
+      })
+        .then((res) => {
+          if (res.data && Array.isArray(res.data) && res.data.length > 0) {
+            this.userKeyList = res.data.map((item) => {
+              if (item.checked) {
+                this.doChangeUserKey(item.token)
+              }
+              return {
+                label: item.name,
+                value: item.token
+              }
+            })
+            if (!this.checkUserKey) {
+              this.doChangeUserKey(this.userKeyList[0].value || '')
             }
-          })
-          if (!this.checkUserKey) {
-            this.doChangeUserKey(this.userKeyList[0].value || '')
+          } else {
+            this.$alert(res.error_msg || '获取用户身份信息异常', '', {
+              confirmButtonText: '点击关闭页面',
+              confirmButtonColor: '#2ABDD1',
+              showClose: false,
+              center: true,
+              callback: (action) => {
+                history.back()
+              }
+            })
           }
-        } else {
-          this.$alert(res.error_msg || '获取用户身份信息异常', '', {
+        })
+        .catch((e) => {
+          this.$alert('获取用户身份信息异常', '', {
             confirmButtonText: '点击关闭页面',
             confirmButtonColor: '#2ABDD1',
             showClose: false,
             center: true,
-            callback: action => {
+            callback: (action) => {
               history.back()
             }
           })
-        }
-      }).catch(e => {
-        this.$alert('获取用户身份信息异常', '', {
-          confirmButtonText: '点击关闭页面',
-          confirmButtonColor: '#2ABDD1',
-          showClose: false,
-          center: true,
-          callback: action => {
-            history.back()
-          }
         })
-      })
     },
-    doChangeUserKey (key = '') {
+    doChangeUserKey(key = '') {
       this.checkUserKey = key
       this.$cookies.set('usrDewkYanV3', key)
       this.getBigInfo()
@@ -239,7 +263,6 @@ export default {
       this.pageLoading = false
       const res = data.data
       if (res) {
-
         const editKeyList = [
           {
             a_key: res.keys || [],
@@ -265,7 +288,6 @@ export default {
           }
         })
 
-
         this.setData.keyList = editKeyList
         this.setData.areaStr = '请选择区域'
         this.setData.areaObj = false
@@ -277,7 +299,7 @@ export default {
           regionMap: {}
         }
 
-        function getMaxSelectCount () {
+        function getMaxSelectCount() {
           var baseNum = res.basenum
           var provincenum = res.provincenum
           if (provincenum === -1) {
@@ -297,15 +319,17 @@ export default {
           this.setData.areaObj = areaInfo.regionMap
         }
 
-
         const maxSelectCount = getMaxSelectCount()
         this.setData.areaCount = maxSelectCount
-        this.setData.canSelectArea = maxSelectCount === -1 ? true : (maxSelectCount > 0)
+        this.setData.canSelectArea =
+          maxSelectCount === -1 ? true : maxSelectCount > 0
 
         if (res.infotype && res.infotype.length) {
           // 免费用户格式不一样，需要转换
           this.setData.infoTypeArr = res.infotype
-          this.setData.infoTypeStr = getOneLevelNamesByValues(res.infotype).join('、')
+          this.setData.infoTypeStr = getOneLevelNamesByValues(
+            res.infotype
+          ).join('、')
         }
 
         this.setData.maxCount = 10
@@ -320,7 +344,6 @@ export default {
           //   this.getBigInfo()
           // })
         }
-
       } else {
         console.log('状态值为：' + res.status)
       }
@@ -388,7 +411,7 @@ export default {
   border-radius: 5px;
 }
 .small-dialog {
-  border-radius: 8px!important;
+  border-radius: 8px !important;
   .el-dialog__title {
     color: #1d1d1d;
   }
@@ -434,7 +457,6 @@ export default {
     .filter-layout.filter-input-layout .el-popper {
       margin-top: 12px;
     }
-
   }
 
   .config-title {
@@ -450,7 +472,7 @@ export default {
     }
   }
 
-  &-title{
+  &-title {
     display: flex;
     align-items: center;
     padding-bottom: 8px;
@@ -463,7 +485,7 @@ export default {
     display: inline-block;
     margin-left: 22px;
     font-size: 14px;
-    color: #2ABED1;
+    color: #2abed1;
     line-height: 22px;
   }
   .reset-tips {
@@ -500,15 +522,15 @@ export default {
       padding: 25px 25px 30px;
     }
   }
-  .prevent-loading{
+  .prevent-loading {
     opacity: 0;
   }
-  .reset-disabled-switch{
+  .reset-disabled-switch {
     margin-left: 9px;
     &.is-disabled {
       opacity: 1;
       .el-switch__core,
-      .el-switch__label{
+      .el-switch__label {
         cursor: pointer;
       }
     }
@@ -521,7 +543,7 @@ export default {
     position: absolute;
     left: 6px;
     top: 0;
-    color: #fff!important;
+    color: #fff !important;
     z-index: 9;
     font-size: 12px;
   }
@@ -530,7 +552,7 @@ export default {
     position: absolute;
     right: 6px;
     top: 0;
-    color: #fff!important;
+    color: #fff !important;
     z-index: 9;
     font-size: 12px;
   }
@@ -554,7 +576,6 @@ export default {
     margin-left: -18px !important;
   }
 
-
   .classify-title {
     .icon-edit,
     .icon-delete {
@@ -563,9 +584,9 @@ export default {
   }
 
   .edit-form {
-      .is-matchway-item {
-        display: none;
-      }
+    .is-matchway-item {
+      display: none;
     }
+  }
 }
 </style>

apps/bigmember_pc/src/views/subscribe/components/key/Edit.vue

@@ -9,7 +9,12 @@
             type="textarea"
             autosize
             resize="none"
-            :placeholder="'请输入关键词' + (isFreeSubCustom ? '' : '，多个关键词用空格隔开，例如：税务局 软件')"
+            :placeholder="
+              '请输入关键词' +
+              (isFreeSubCustom
+                ? ''
+                : '，多个关键词用空格隔开，例如：税务局 软件')
+            "
             debounce="600"
             maxlength="200"
             @input="keywordsInput"
@@ -99,7 +104,7 @@
           @click="submitKeywords"
         >
           保存<span style="font-size: 12px">
-            (近3个月内共匹配{{ pushCount }}条信息)</span
+            (近{{ matchTimeText }}内共匹配{{ pushCount }}条信息)</span
           >
         </button>
         <button type="button" class="cancle-btn" @click="cancelEdit">
@@ -158,6 +163,14 @@ export default {
     className: '',
     classIndex: Number,
     keyIndex: Number,
+    matchTimeText: {
+      type: String,
+      default: '3个月'
+    },
+    noSpaceWhenClickRecommend: {
+      type: Boolean,
+      default: false
+    },
     // 订阅设置开关
     setStatus: {
       type: Boolean,
@@ -198,7 +211,14 @@ export default {
     littleTip() {
       return this.pushCount < 30 && this.cur.key !== ''
     },
-    isFreeSubCustom () {
+    addSplitter() {
+      if (this.noSpaceWhenClickRecommend) {
+        return ''
+      } else {
+        return ' '
+      }
+    },
+    isFreeSubCustom() {
       return this.$route.meta?.vt === 'f'
     }
   },
@@ -311,13 +331,13 @@ export default {
     // 添加订阅推荐到输入框
     addSameItem(e, item) {
       item.selected = !item.selected
-      const m = this.cur.key.split(' ')
+      const m = this.cur.key.split(this.addSplitter)
       if (item.selected) {
         m.push(item.word)
-        this.cur.key = m.join(' ')
+        this.cur.key = m.join(this.addSplitter)
       } else {
         m.remove(item.word)
-        this.cur.key = m.join(' ')
+        this.cur.key = m.join(this.addSplitter)
       }
       setTimeout(() => {
         this.getPushCountFn()

apps/bigmember_pc/src/views/subscribe/components/key/List.vue

@@ -12,7 +12,11 @@
           @click="goThisTop(index)"
           :data-diy-sticky-mapping="'sticky-' + index"
         >
-          <div class="flex-r-c" v-loading="!setStatus" element-loading-custom-class="prevent-loading">
+          <div
+            class="flex-r-c"
+            v-loading="!setStatus"
+            element-loading-custom-class="prevent-loading"
+          >
             <span class="title-text">{{ item.s_item }}</span>
             <span
               class="icon-edit"
@@ -23,7 +27,11 @@
               @click="deleteClassFn(item, item.groupIndex)"
             ></span>
           </div>
-          <div class="flex-r-c right" v-loading="!setStatus" element-loading-custom-class="prevent-loading">
+          <div
+            class="flex-r-c right"
+            v-loading="!setStatus"
+            element-loading-custom-class="prevent-loading"
+          >
             <el-button
               type="primary"
               class="add-classfily"
@@ -54,7 +62,11 @@
         class="classify-title flex-r-c sb"
         :data-diy-sticky-origin="'sticky-' + index"
       >
-        <div class="flex-r-c" v-loading="!setStatus" element-loading-custom-class="prevent-loading">
+        <div
+          class="flex-r-c"
+          v-loading="!setStatus"
+          element-loading-custom-class="prevent-loading"
+        >
           <span class="title-text">{{ item.s_item }}</span>
           <span
             class="icon-edit"
@@ -82,7 +94,8 @@
           <div
             class="add-words-box"
             @click="addNewKeyword(item, item.groupIndex)"
-            v-loading="!setStatus" element-loading-custom-class="prevent-loading"
+            v-loading="!setStatus"
+            element-loading-custom-class="prevent-loading"
             v-if="!item.showForm"
             key="add"
           >
@@ -93,6 +106,8 @@
               :datas="newWordsList"
               :className="item.s_item"
               title="新增"
+              :matchTimeText="matchTimeText"
+              :noSpaceWhenClickRecommend="noSpaceWhenClickRecommend"
               :classIndex="item.groupIndex"
               :keyIndex="item.a_key.length"
               :setStatus="setStatus"
@@ -128,7 +143,11 @@
                   排除词: {{ v.notkey.join(' ') }}
                 </p>
               </div>
-              <div class="list-right" v-loading="!setStatus" element-loading-custom-class="prevent-loading">
+              <div
+                class="list-right"
+                v-loading="!setStatus"
+                element-loading-custom-class="prevent-loading"
+              >
                 <span
                   class="icon-edit"
                   @click="editKeyFn(item, v, item.groupIndex, v.keyindex)"
@@ -254,7 +273,9 @@
       center
       :show-close="false"
     >
-      <p class="dialog-text">您的关键词组数量已达{{datas.maxCount}}组，无法继续添加</p>
+      <p class="dialog-text">
+        您的关键词组数量已达{{ datas.maxCount }}组，无法继续添加
+      </p>
       <span slot="footer" class="dialog-footer">
         <el-button class="know-btn" type="primary" @click="dialog.limit = false"
           >我知道了</el-button
@@ -283,6 +304,8 @@ export default {
     [CollapseTransition.name]: CollapseTransition
   },
   props: {
+    matchTimeText: String,
+    noSpaceWhenClickRecommend: Boolean,
     datas: {
       keyList: Array,
       maxCount: Number
@@ -700,7 +723,7 @@ export default {
         .el-button--default:hover,
         .el-button--default:active {
           color: #686868;
-          border-color: #E0E0E0;
+          border-color: #e0e0e0;
           background: #fff;
         }
       }