service

foyo-service/src/main/java/com/huiju/foyo/controller/TaServiceController.java

 import com.huiju.foyo.common.ConstantFoyo;
 import com.huiju.foyo.common.ResponseBean;
 import com.huiju.foyo.model.TaService;
+import com.huiju.foyo.model.TaServiceLabel;
+import com.huiju.foyo.service.ITaServiceLabelService;
 import com.huiju.foyo.service.ITaServiceService;
 import org.slf4j.Logger;
 import org.slf4j.LoggerFactory;
     @Autowired
     public ITaServiceService iTaServiceService;
 
+    @Autowired
+    private ITaServiceLabelService taServiceLabelService;
 
     /**
      * 分页查询列表
             taService.setCreateTime(LocalDateTime.now());
             taService.setCreateBy(ConstantFoyo.USER_ADMIN);
             if (iTaServiceService.save(taService)){
+                //保存对应的标签
+                List<TaServiceLabel> serviceLabelList = new ArrayList<>();
+                List<String> labelList = taService.getLabelList();
+                labelList.stream().forEach(e -> {
+                    TaServiceLabel taServiceLabel = new TaServiceLabel();
+                    taServiceLabel.setLabelName(e);
+                    taServiceLabel.setServiceId(taService.getId());
+                    taServiceLabel.setCreateTime(LocalDateTime.now());
+                    taServiceLabel.setCreateBy(ConstantFoyo.USER_ADMIN);
+                    serviceLabelList.add(taServiceLabel);
+                });
+                taServiceLabelService.saveBatch(serviceLabelList);
+                
                 responseBean.addSuccess(taService);
             }else {
                 responseBean.addError("fail");

foyo-service/src/main/java/com/huiju/foyo/model/TaService.java

 package com.huiju.foyo.model;
 
 import com.baomidou.mybatisplus.annotation.IdType;
+import com.baomidou.mybatisplus.annotation.TableField;
 import com.baomidou.mybatisplus.annotation.TableId;
 import lombok.Data;
 import lombok.EqualsAndHashCode;
 
 import java.io.Serializable;
 import java.time.LocalDateTime;
+import java.util.ArrayList;
+import java.util.List;
 
 /**
  * <p>
      * 排序
      */
     private Integer sort;
-
-
+    
+    /**
+     * 服务标签
+     */
+    @TableField(exist = false)
+    private List<String> labelList = new ArrayList<>();
 }

vue-element-admin/src/views/service/edit.vue

           <i v-else class="el-icon-plus avatar-uploader-icon"/>
         </el-upload>
       </el-form-item>
+      <el-form-item>
+        <el-tag
+          v-for="tag in dynamicTags"
+          :key="tag"
+          :disable-transitions="false"
+          closable
+          @close="handleClose(tag)">
+          {{ tag }}
+        </el-tag>
+        <el-input
+          v-if="inputVisible"
+          ref="saveTagInput"
+          v-model="inputValue"
+          size="small"
+          class="input-new-tag"
+          @keyup.enter.native="handleInputConfirm"
+          @blur="handleInputConfirm"/>
+        <el-button v-else class="button-new-tag" closable @click="showInput">+ 添加标签</el-button>
+      </el-form-item>
     </el-form>
     <div slot="footer" class="dialog-footer">
       <el-button @click="dialogForm('0')">取 消</el-button>
         id: '',
         serviceName: '',
         sort: '',
-        serviceImageUrl: ''
+        serviceImageUrl: '',
+        labelList: []
       },
       uploadImgUrl: process.env.BASE_API + '/uploadimage',
       dialogStatus: '',
       bannerPositionArr: [
         { id: 1, value: '首页banner' },
         { id: 2, value: '服务banner' }
-      ]
+      ],
+      dynamicTags: [],
+      inputVisible: false,
+      inputValue: ''
     }
   },
   computed: {
     createData() {
       this.$refs['form'].validate((valid) => {
         if (valid) {
+          this.form.labelList = this.dynamicTags
           this.$store.dispatch('service/createService', this.form).then((res) => {
             if (res.data.code === '0') {
               this.$message({
           })
         }
       })
+    },
+    handleClose(tag) {
+      this.dynamicTags.splice(this.dynamicTags.indexOf(tag), 1)
+    },
+    showInput() {
+      this.inputVisible = true
+      this.$nextTick(_ => {
+        this.$refs.saveTagInput.$refs.input.focus()
+      })
+    },
+    handleInputConfirm() {
+      const inputValue = this.inputValue
+      if (inputValue) {
+        this.dynamicTags.push(inputValue)
+      }
+      this.inputVisible = false
+      this.inputValue = ''
     }
   }
 }
 .dialog-footer {
   text-align: center;
 }
+.el-tag + .el-tag {
+    margin-left: 10px;
+  }
+  .button-new-tag {
+    margin-left: 10px;
+    height: 32px;
+    line-height: 30px;
+    padding-top: 0;
+    padding-bottom: 0;
+  }
+  .input-new-tag {
+    width: 90px;
+    margin-left: 10px;
+    vertical-align: bottom;
+  }
 </style>
 <style>
 .avatar-uploader .el-upload {