对接添加标签组件

src/components/tagDetail/mixin/index.js

@@ -621,7 +621,6 @@ export default {
         .then(res => {
           let resData = res.data;
           if (resData.errorCode == 1) {
-            debugger;
             this.successAdd = true;
             if (that.tabActive != 'second') {
               // 如果是在暂存架修改标签值
@@ -629,7 +628,7 @@ export default {
             }
             that.closeTagShortDialog();
             // 如果来源是 会员标签编辑的时候
-            if (that.fromFlag == 'memberGroup') {
+            // if (that.fromFlag == 'memberGroup') {
               let sendObj = {
                 tagId: that.tagShortId || this.tagId,
                 tagValue: JSON.stringify(tagValue),
@@ -637,13 +636,11 @@ export default {
                 tagName: that.tagData.tagName,
                 isActive: that.tagData.isActive
               };
-              // that.closeTagShortDialog()
-              that.$emit('returnTagData', sendObj);
-              return false;
-            }
+              this.$emit('returnTagData', sendObj);
+              // return false;
+            // }
             // 更新暂存架
-            that.$emit('updateTemp');
-            return;
+            // that.$emit('updateTemp');
           }
         })
         .catch(function(error) {

src/view/platformTag/member-tag.vue

@@ -21,7 +21,7 @@
               {{ tagName }}
               <el-button type="primary" class="add-newtag" @click="addNewTag" v-show="handTag == 1">新增标签</el-button>
             </p>
-            <tag-container :data="memberTagList" :handTag="handTag" :groupId="groupId" @deleteHandTag="deleteHandTag"> </tag-container>
+            <tag-container :data="memberTagList" :handTag="handTag" :groupId="groupId" @deleteHandTag="deleteHandTag" @returnTagData="returnTagData"> </tag-container>
 
             <div class="page-box" v-if="total > 0">
               <el-pagination
@@ -37,9 +37,9 @@
             </div>
 
             <!-- 我的标签 -->
-            <div class="my-pop-tagbox" v-if="chooseTagList.length > 0">
+            <div class="my-pop-tagbox" v-if="selectedTags.length > 0" @click="expendsGroupList">
               <p class="txt">已选标签</p>
-              <p class="number-txt">{{ chooseTagList.length }}</p>
+              <p class="number-txt">{{ selectedTags.length }}</p>
             </div>
           </div>
         </div>
@@ -49,15 +49,26 @@
     <div class="foot-box">
       <vue-gic-footer></vue-gic-footer>
     </div>
+
+    <div class="grouo-right-list" v-show="groupShow && selectedTags.length">
+      <el-collapseTransition>
+        <tags-group-list :selectedTagsData="selectedTags" :tagsGroupRelation="tagsGroupRelation" @addTags="addTags" @editTags="editTags" />
+      </el-collapseTransition>
+    </div>
   </div>
 </template>
 
 <script>
+import Vue from 'vue';
+import { CollapseTransition } from 'element-ui';
 import navCrumb from '@/components/nav/nav.vue';
+import TagsGroupList from '../memberGroup/tags-group-list';
 import TagType from './tag-type';
 import TagContainer from './tag-container';
 import { getMemberTag, getMemberTagList } from '@/request/api';
 
+Vue.component(CollapseTransition.name, CollapseTransition);
+
 export default {
   name: 'member-tag',
 
@@ -66,12 +77,15 @@ export default {
   components: {
     navCrumb,
     TagType,
-    TagContainer
+    TagContainer,
+    TagsGroupList
   },
 
   data() {
     return {
-      chooseTagList: [{}],
+      groupShow: false,
+      selectedTags: [],
+      tagsGroupRelation: [[]],
       // 面包屑参数
       navpath: [
         {
@@ -101,6 +115,25 @@ export default {
   },
 
   methods: {
+    expendsGroupList() {
+      if (this.selectedTags && this.selectedTags.length) {
+        this.groupShow = true;
+      }
+    },
+    returnTagData(list) {
+      console.log(this.selectedTags);
+      // 如果存在id
+      let index = this.selectedTags.findIndex(el => el.tagId === list.tagId);
+      if (index < 0) {
+        this.selectedTags.push(list);
+      }
+    },
+    editTags() {
+      //
+    },
+    addTags() {
+      //
+    },
     async getTagList() {
       const Data = await getMemberTag();
       if (Data.result && Data.result.length) {
@@ -284,6 +317,7 @@ export default {
 
 <style lang="scss" scoped>
 .member-tag {
+  position: relative;
   width: 100%;
   overflow-y: auto;
   .tag-container {
@@ -364,5 +398,14 @@ export default {
       transform: scale(1.2);
     }
   }
+  .grouo-right-list {
+    position: absolute;
+    top: 0px;
+    right: 0px;
+    bottom: 0px;
+    padding: 10px;
+    box-shadow: 0 0 5px #bbb;
+    background-color: #fff;
+  }
 }
 </style>

src/view/platformTag/tag-container.vue

@@ -180,10 +180,10 @@ export default {
       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;
+          // 传出数据到tags-group-list
         }
       }, 200);
     }

static/css/index.less

@@ -40,4 +40,4 @@
   transition: transform .3s;
   transform: rotate(-90deg);
   color: #c0c4cc;
-}
\ No newline at end of file
+}