修改会员标签设置

src/components/tag/batch-list.vue

+<template>
+  <el-dialog title="批量操作分组数据" width="340px" top="30vh" :visible.sync="batchDialog" center :modal-append-to-body="false" :before-close="closeBatch">
+    <div class="batch-content">
+      <div v-if="operNum == 0">
+        <div class="el-message-box__status el-icon-warning"></div>
+        <p class="batch-txt">是否确定批量修改分组为失效！</p>
+      </div>
+      <div v-if="operNum == 1">
+        <div class="el-message-box__status el-icon-warning"></div>
+        <p class="batch-txt">是否确定批量删除分组！</p>
+      </div>
+      <div v-if="operNum == 2">
+        我的会员分组
+        <ul class="batch-ul">
+          <li v-for="item in groupList" :key="item.memberTagGroupClassifyId" class="batch-li" @click="chooseGroup(item)">
+            {{ item.classifyName }}
+          </li>
+        </ul>
+        <p class="group-name">选中的分组：{{ groupName }}</p>
+      </div>
+    </div>
+
+    <span slot="footer" class="dialog-footer">
+      <el-button @click="closeBatch">取 消</el-button>
+      <el-button type="primary" @click="confirmBatch">确 定</el-button>
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+import { memberGroupList, batchModifyEffective, batchDeleteGroup, batchChangeGroup } from '@/request/api';
+
+export default {
+  name: 'batch-list',
+
+  props: {
+    batchVisiable: Boolean,
+    operateNumber: Number,
+    multipleSelection: Array
+  },
+
+  data() {
+    return {
+      batchDialog: false,
+      operNum: -1,
+      groupList: [],
+      groupName: ''
+    };
+  },
+
+  methods: {
+    confirmBatch() {
+      console.log(this.operateNumber);
+      let batchNum = this.operateNumber;
+      let tagIds = this.selectionList.map(el => el.memberTagGroupId);
+      const param = {
+        requestProject: 'gic-member-tag-web',
+        memberTagGroupIds: tagIds.join(',')
+      };
+      // 1 批量失效 2批量删除 3批量转移会员组
+      if (batchNum == 0) {
+        param.effectiveStatus = 0;
+        batchModifyEffective(param)
+          .then(res => {
+            if (res.errorCode == 1) {
+              console.log(res);
+              this.$message.success({
+                message: '修改成功'
+              });
+            }
+          })
+          .catch(err => {
+            console.log(err);
+          });
+      } else if (batchNum == 1) {
+        batchDeleteGroup(param).then(res => {
+          if (res.errorCode == 1) {
+            this.$message.success({
+              message: '删除成功'
+            });
+          }
+        });
+      } else if (batchNum == 2) {
+        if (!this.groupName) {
+          this.$message.warning({
+            message: '请先选择的会员分组的分类'
+          });
+          return;
+        }
+        let index = this.groupList.findIndex(el => el.classifyName === this.groupName);
+        param.memberTagGroupClassifyId = this.groupList[index].memberTagGroupClassifyId;
+        batchChangeGroup(param)
+          .then(res => {
+            if (res.errorCode == 1) {
+              this.$message.success({
+                message: '修改分类成功'
+              });
+            }
+          })
+          .catch(err => {
+            console.log(err);
+          });
+      }
+      this.closeBatch();
+      // 触发更新
+      this.$emit('refresh-list');
+    },
+    // 选择分组
+    chooseGroup(list) {
+      this.groupName = list.classifyName;
+    },
+    // 关
+    closeBatch() {
+      this.batchDialog = false;
+      this.$emit('update:batchVisiable', false);
+    },
+    getMemberGroupList() {
+      memberGroupList({
+        requestProject: 'gic-member-tag-web'
+      })
+        .then(res => {
+          if (res.errorCode === 1) {
+            this.groupList = res.result.map(el => ({
+              ...el,
+              edit: false
+            }));
+          }
+        })
+        .catch(err => {
+          console.log(err);
+        });
+    }
+  },
+
+  created() {
+    this.getMemberGroupList();
+    this.selectionList = [];
+  },
+
+  watch: {
+    batchVisiable(newval) {
+      this.batchDialog = newval;
+    },
+    operateNumber(newval) {
+      this.operNum = newval;
+    },
+    multipleSelection: {
+      immediate: true,
+      handler(newval) {
+        this.selectionList = newval;
+      }
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.batch-txt {
+  padding-left: 35px;
+  padding-top: 7px;
+}
+.batch-ul {
+  margin-top: 10px;
+  .batch-li {
+    padding: 5px 10px;
+    cursor: pointer;
+    &:hover {
+      background-color: #f3f6f9;
+    }
+  }
+}
+.group-name {
+  margin-top: 20px;
+  font-size: 16px;
+  font-weight: bold;
+}
+</style>

src/components/tag/tag-config-options.vue

@@ -32,7 +32,7 @@
           <el-radio v-model="parent.radio" label="1">固定时段</el-radio>
           <el-radio v-model="parent.radio" label="2">相对时段</el-radio>
           <!-- 固定时段 -->
-          <div class="m-t-18 w-438 p-20 border-box bg-f3f6f9" v-if="parent.radio == 1">
+          <div class="m-t-18 p-20 border-box bg-f3f6f9" v-if="parent.radio == 1">
             <el-date-picker
               v-model="parent.dateRangeValue"
               type="daterange"

src/components/tagDetail/mixin/index.js

@@ -604,7 +604,7 @@ export default {
       });
       that.postTemplateData.template = that.templateData;
       tagParams = that.postTemplateData;
-      that.addToTemp(tagValue, tagParams);
+      await this.addToTemp(tagValue, tagParams);
     },
 
     /**
@@ -613,7 +613,7 @@ export default {
     addToTemp(tagValue, tagParams) {
       const that = this;
       const para = {
-        tagId: that.tagShortId,
+        tagId: that.tagShortId || this.tagId,
         tagValue: JSON.stringify(tagValue), // 标签选择保存值
         tagParams: JSON.stringify(tagParams) // 标签前端选择
       };
@@ -621,6 +621,8 @@ export default {
         .then(res => {
           let resData = res.data;
           if (resData.errorCode == 1) {
+            debugger;
+            this.successAdd = true;
             if (that.tabActive != 'second') {
               // 如果是在暂存架修改标签值
               showMsg.showmsg('添加成功', 'success');
@@ -629,7 +631,7 @@ export default {
             // 如果来源是 会员标签编辑的时候
             if (that.fromFlag == 'memberGroup') {
               let sendObj = {
-                tagId: that.tagShortId,
+                tagId: that.tagShortId || this.tagId,
                 tagValue: JSON.stringify(tagValue),
                 tagParams: JSON.stringify(tagParams),
                 tagName: that.tagData.tagName,
@@ -643,13 +645,9 @@ export default {
             that.$emit('updateTemp');
             return;
           }
-          errMsg.errorMsg(resData);
         })
         .catch(function(error) {
-          that.$message.error({
-            duration: 1000,
-            message: error.message
-          });
+          
         });
     },
 

src/request/api.js

@@ -103,3 +103,29 @@ export const findSecondMemberList = params =>
     method: 'get',
     params: params
   });
+
+/**
+ * 批量修改失效
+ */
+export const batchModifyEffective = params =>
+  request({
+    url: '/member-tag-group/simpleUpdateBatch',
+    method: 'get',
+    params: params
+  });
+
+// 删除分组
+export const batchDeleteGroup = params =>
+  request({
+    url: '/member-tag-group/deleteBatch',
+    method: 'get',
+    params: params
+  });
+
+// 分组归属
+export const batchChangeGroup = params =>
+  request({
+    url: '/member-tag-group/changeClassify',
+    method: 'get',
+    params: params
+  });

src/view/memberGroup/memberGroupList.vue

@@ -159,10 +159,12 @@
       </div>
     </div>
     <vue-gic-footer></vue-gic-footer>
+    <batch-list :batchVisiable.sync="batchVisiable" @refresh-list="refreshList" :operateNumber="operateNumber" :multipleSelection="multipleSelection"></batch-list>
   </div>
 </template>
 <script>
 /* eslint-disable */
+import BatchList from '@/components/tag/batch-list';
 import navCrumb from '@/components/nav/nav.vue';
 import strLength from '@/common/js/strlen';
 import showMsg from '@/common/js/showmsg';
@@ -175,16 +177,22 @@ import GroupList from './group-list';
 import RecommendTable from './recommend-table';
 // import { memberGroupList } from '@/request/api';
 // import groupTransfer from '@/components/groupTransfer';
+
+
+
 export default {
   name: 'memberGroupList',
   components: {
     // groupTransfer,
     navCrumb,
     GroupList,
-    RecommendTable
+    RecommendTable,
+    BatchList
   },
   data() {
     return {
+      operateNumber: -1,
+      batchVisiable: false,
       dialogVisible: true,
       isRecommend: false,
       recommendItems: [],
@@ -212,6 +220,8 @@ export default {
       // 会员分组列表数据
       groupTableData: [],
 
+      multipleSelection: [], // 表格的多选框批量操作
+
       // 分页参数
       currentPage: 1,
       pageSize: 20,
@@ -255,6 +265,9 @@ export default {
     }
   },
   methods: {
+    refreshList() {
+      this.getGroupList();
+    },
     // 会员分组二级
     getsecondList(list) {
       const param = {
@@ -328,14 +341,23 @@ export default {
     },
 
     // 勾选框全选
-    handleSelectionChange() {
-
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
     },
     /**
      * 批量操作
      */
     batchHandleSelect(val) {
-
+      this.operateNumber = val;
+      console.log(this.multipleSelection);
+      if (!this.multipleSelection.length) {
+        this.$message.warning({
+          message: '请先勾选分组',
+          duration: 2000
+        });
+        return;
+      }
+      this.batchVisiable = true;
     },
 
     setRowClassName({ row, rowIndex }) {
@@ -616,6 +638,9 @@ export default {
   },
   mounted() {
     this.getGroupList();
+    this.config = {
+
+    };
   }
 };
 </script>

src/view/platformTag/member-tag.vue

@@ -35,6 +35,12 @@
                 :total="total"
               ></el-pagination>
             </div>
+
+            <!-- 我的标签 -->
+            <div class="my-pop-tagbox" v-if="chooseTagList.length > 0">
+              <p class="txt">已选标签</p>
+              <p class="number-txt">{{ chooseTagList.length }}</p>
+            </div>
           </div>
         </div>
       </div>
@@ -65,6 +71,7 @@ export default {
 
   data() {
     return {
+      chooseTagList: [{}],
       // 面包屑参数
       navpath: [
         {
@@ -115,7 +122,10 @@ export default {
         };
         const Data = await getMemberTagList(params);
         if (Data.result.result && Data.result.result.length) {
-          this.memberTagList = Data.result.result;
+          this.memberTagList = Data.result.result.map(el => ({
+            ...el,
+            refersh: false
+          }));
           this.total = Data.result.totalCount;
         } else {
           this.memberTagList = [];
@@ -299,6 +309,7 @@ export default {
       }
     }
     .tag-all {
+      position: relative;
       flex: 1;
       position: relative;
       .tag-name {
@@ -326,5 +337,32 @@ export default {
       padding: 16px 20px;
     }
   }
+  .my-pop-tagbox {
+    position: absolute;
+    z-index: 2;
+    right: 40px;
+    bottom: 100px;
+    height: 70px;
+    width: 70px;
+    color: #fff;
+    background-color: #1890ff;
+    box-shadow: 0 0 5px #555;
+    border-radius: 50%;
+    cursor: pointer;
+    .txt {
+      text-align: center;
+      padding-top: 25px;
+      font-size: 12px;
+    }
+    .number-txt {
+      text-align: center;
+      padding-top: 5px;
+      font-size: 14px;
+    }
+    &:hover {
+      transition: all ease 0.3s;
+      transform: scale(1.2);
+    }
+  }
 }
 </style>

src/view/platformTag/tag-container.vue

@@ -7,7 +7,7 @@
           <template slot-scope="scope">
             <span class="tag-name">{{ scope.row.tagName }}</span>
             <el-tooltip class="item" effect="dark" content="添加标签" placement="bottom">
-              <i class="el-icon-plus icon-tag-name" @click="addTag(scope.row)"></i>
+              <i class="el-icon-plus icon-tag-name" :class="{ 'el-icon-refresh': scope.row.refersh }" @click="addTag(scope.row)"></i>
             </el-tooltip>
           </template>
         </el-table-column>
@@ -36,6 +36,7 @@
         <p class="tag-desc">根据会员信息扩展字段统计而来</p>
         <p class="tag-desc">标签值设置</p>
         <!-- 所有标签的配置项 -->
+
         <tag-config-options v-if="optionFlag" :tagId="tagId" ref="tagConfig"> </tag-config-options>
 
         <!-- <div class="tag-value">
@@ -55,7 +56,7 @@
         </div>
       </div>
       <span slot="footer" class="dialog-footer">
-        <el-button @click="dialogVisible = false">取 消</el-button>
+        <el-button @click="closeTagDialog">取 消</el-button>
         <el-button type="primary" @click="confirmOptions">确 定</el-button>
       </span>
     </el-dialog>
@@ -64,12 +65,15 @@
 
 <script>
 import TagMode from '@/components/tag/tag-mode';
+import tagDetails from '@/components/tagDetail/mixin/index';
 import TagConfigOptions from '@/components/tag/tag-config-options';
 import { delThirdHandTag } from '@/request/api';
 
 export default {
   name: 'tag-container',
 
+  mixins: [tagDetails],
+
   components: {
     TagMode,
     TagConfigOptions
@@ -91,12 +95,25 @@ export default {
 
   data() {
     return {
+      successAdd: false,
       tableData: [],
       dialogVisible: false,
       dialogData: {},
       TimeOptions: [],
       optionFlag: false,
-      tagId: ''
+      templateData: [],
+      tagId: '',
+      postTemplateData: {
+        selectedVal: [],
+        template: []
+      },
+      tagData: {
+        tagId: '',
+        tagName: '',
+        tagDescribe: '',
+        isActive: 0, // 是否实时
+        inputSearch: '' // 输入搜索
+      }
     };
   },
 
@@ -108,6 +125,7 @@ export default {
     // 添加标签 弹框里面操作
     addTag(list) {
       this.dialogData = list;
+      this.middleList = list;
       if (list.tagId) {
         this.optionFlag = true;
         this.tagId = list.tagId;
@@ -154,11 +172,27 @@ export default {
     /**
      *
      */
-    confirmOptions() {
-      console.log(this.$refs.tagConfig.getTemplateData());
+    async confirmOptions() {
+      this.successAdd = false;
+      const ret = this.$refs.tagConfig.getTemplateData();
+      this.templateData = JSON.parse(JSON.stringify(ret));
+      this.confirmPost();
+      setTimeout(_ => {
+        // 如果成功就修改
+        if (this.successAdd) {
+          console.log(1);
+          this.dialogVisible = false;
+          let index = this.tableData.findIndex(el => el.tagId === this.middleList.tagId);
+          this.tableData[index].refersh = true;
+        }
+      }, 200);
     }
   },
 
+  created() {
+    this.middleList = null;
+  },
+
   watch: {
     data: {
       immediate: true,