修改导航名称为栏目名称

src/components/InputTag/index.vue

@@ -8,6 +8,7 @@
                     ref="saveTagInput"
                     @keyup.enter.native="handleInputConfirm"
                     @blur="handleInputConfirm"
+                    placeholder="请输关键词,并按回车"
                 >
                 </el-input>
             </div>

src/views/website/categoryList.vue

@@ -43,8 +43,15 @@
             <el-table-column fixed prop="id" label="编号" width="50"></el-table-column>
             <el-table-column prop="name" label="栏目名称"></el-table-column>
             <!-- <el-table-column prop="department_name" label="行政职能部门"></el-table-column>
-            <el-table-column prop="city_name" label="行政区划"></el-table-column> -->
-            <el-table-column prop="sort" label="权重"></el-table-column>
+            <el-table-column prop="city_name" label="行政区划"></el-table-column> --> 父级栏目
+            <!-- <el-table-column prop="sort" label="权重"></el-table-column> -->
+            <el-table-column  label="父级栏目">
+              <template slot-scope="scope">
+                <div>
+                 {{scope.row.parent_name?scope.row.parent_name:"---"}} 
+                </div>
+              </template>
+            </el-table-column>
             <el-table-column prop="created_at" label="创建时间"></el-table-column>
             <el-table-column prop="updated_at" label="修改时间"></el-table-column>
             <el-table-column fixed="right" label="操作" width="200"  header-align="center">
@@ -88,7 +95,8 @@
               <el-input v-model="form.seo_title" autocomplete="off" placeholder="请输入栏目标题"></el-input>
             </el-form-item>
             <el-form-item label="栏目关键词：" :label-width="formLabelWidth" prop="seo_keywords" class="custom-align-right">
-              <el-input v-model="form.seo_keywords" autocomplete="off" placeholder="请输入栏目关键词"></el-input>
+              <!-- <el-input v-model="form.seo_keywords" autocomplete="off" placeholder="请输入栏目关键词"></el-input> -->
+              <inputTag  :initialTags="tags" @tags-updated="updateTags"/> 
             </el-form-item>
             <el-form-item label="栏目描述：" :label-width="formLabelWidth" prop="seo_description" class="custom-align-right">
               <el-input type="textarea" v-model="form.seo_description" placeholder="请输入栏目描述"></el-input>
@@ -108,7 +116,7 @@
             <el-form-item label="父级栏目：" :label-width="formLabelWidth" class="custom-align-right">
               <el-cascader :key="parentKey" v-model="form.pid_arr" placeholder="请选择要绑定的父级栏目" :props="parentData" filterable clearable></el-cascader>
             </el-form-item>
-            <el-form-item label="导航标题：" :label-width="formLabelWidth" prop="seo_title" class="custom-align-right">
+            <el-form-item label="栏目标题：" :label-width="formLabelWidth" prop="seo_title" class="custom-align-right">
               <template #label>
                 <span class="askBox">
                   栏目标题：
@@ -128,7 +136,8 @@
                   </el-tooltip>
                 </span>
               </template>
-              <el-input v-model="form.seo_keywords" autocomplete="off" placeholder="请输入栏目关键词"></el-input>
+              <!-- <el-input v-model="form.seo_keywords" autocomplete="off" placeholder="请输入栏目关键词"></el-input> -->
+              <inputTag  :initialTags="tags" @tags-updated="updateTags"/> 
             </el-form-item>
             <el-form-item label="栏目描述：" :label-width="formLabelWidth" prop="seo_description" class="custom-align-right">
               <template #label>
@@ -161,12 +170,14 @@
 <script>
 //表格标题
 import tableTitle from './components/tableTitle';
+import InputTag from '@/components/InputTag';
 //引入公用样式
 import '@/styles/global.less';
 
 export default {
   components: {
     tableTitle,//表格标题
+    InputTag
   },
   data() {
     //0.全局操作 start ------------------------------------------------------------>
@@ -194,7 +205,7 @@ export default {
     // }
     const validatePid = (rule,value,callback) => {
       if (value.length === 0) {
-          callback(new Error('请选择父级导航！'))
+          callback(new Error('请选择父级栏目！'))
       } else {
           callback()
       }
@@ -202,13 +213,14 @@ export default {
     let self = this;
     //0.全局操作 end ------------------------------------------------------------>
     return {
+      tags:[],
       //1.列表和分页相关 start ------------------------------------------------------------>
       tableDivTitle:"栏目名称列表",
       tableData:[],//内容
       allCount:0,//总条数
       editId:0,//要修改的网站id
       getApiData:{
-        name:"",//导航池名称查询
+        name:"",//栏目池名称查询
         // department_id:[],//行政职能部门id
         // city_id:[],//行政区划
         page:1,//当前是第几页
@@ -286,7 +298,7 @@ export default {
       //4.弹出框中的表单设置 start ------------------------------------------------------------>
       //4.1表单收集的数据
       form: {
-        name: '',//导航池名称
+        name: '',//栏目池名称
         is_url:0,//是否为外链，0=否 1=是
         web_url:"",//外链地址
         // department_arr_id:[],//职能部门
@@ -296,16 +308,16 @@ export default {
         seo_title:"",//标题
         seo_keywords:"",//关键词
         seo_description:"",//描述
-        pid_arr:[]//父级导航
+        pid_arr:[]//父级栏目
       },
       //4.2表单验证规则
       formRules: {
         //网站名称不能为空
-        name:[{required:true,trigger:'blur',validator:validateEmpty}],//导航池名称不能为空
+        name:[{required:true,trigger:'blur',validator:validateEmpty}],//栏目池名称不能为空
         web_url:[{required:true,trigger:'blur',validator:validateEmpty}],//外链地址不能为空
         // department_arr_id: [{type:'array',required:true,trigger:'change',message:'请选择职能部门！',validator:validateDepartment}],
         // city_arr_id: [{type:'array',required:true,trigger:'change',message:'请选择行政区划！',validator:validateCity}],
-        // pid_arr: [{type:'array',required:true,trigger:'change',message:'请选择父级导航！',validator:validatePid}],
+        // pid_arr: [{type:'array',required:true,trigger:'change',message:'请选择父级栏目！',validator:validatePid}],
         seo_title:[{required:true,trigger:'blur',validator:validateEmpty}],//标题不能为空
         seo_keywords:[{required:true,trigger:'blur',validator:validateEmpty}],//关键词不能为空
         seo_description:[{required:true,trigger:'blur',validator:validateEmpty}],//描述不能为空
@@ -366,7 +378,7 @@ export default {
       //     })
       //   }
       // },
-      parentKey:0,//获取父级导航
+      parentKey:0,//获取父级栏目
       parentData: {
         checkStrictly: true,
         lazy: true,
@@ -492,10 +504,11 @@ export default {
       //this.clearToServe();
       this.windowStatus = true;
     },
-    //2.1.1 添加导航池
+    //2.1.1 添加栏目池
     addCategoryList(){
       this.editId = 0;
       this.editBtn = false;
+      this.tags = []
       this.openWindow();
     },
     //2.2 关闭弹出框
@@ -529,7 +542,7 @@ export default {
     },
     //弹出框设置 end ------------------------------------------------------------>
 
-    //3.添加导航池 start ------------------------------------------------------------>
+    //3.添加栏目池 start ------------------------------------------------------------>
     ifUrl(value){
       //console.log(value)
       if(value == true){
@@ -544,7 +557,7 @@ export default {
       if(this.show_url == true){
         this.clearToServe(1)
       }
-      //判断有没有添加父级导航
+      //判断有没有添加父级栏目
       if(this.form.pid_arr.length==0){
         this.form.pid_arr = [0];
       }
@@ -554,7 +567,7 @@ export default {
             //汇报结果
             this.$message({
               type: 'success',
-              message: '已成功添加导航池！'
+              message: '已成功添加栏目池！'
             });
             //清空并退出
             this.closeWindow();
@@ -569,9 +582,9 @@ export default {
       })
 
     },
-    //添加导航池 end ------------------------------------------------------------>
+    //添加栏目池 end ------------------------------------------------------------>
 
-    //编辑导航池 start ------------------------------------------------------------>
+    //编辑栏目池 start ------------------------------------------------------------>
     getDataMain(id){
       //先清空窗口
       this.clearToServe(2)
@@ -585,7 +598,7 @@ export default {
         //清除错误状态
         //this.$refs.form.clearValidate();
         console.log(res)
-        //回显导航池名称
+        //回显栏目池名称
         this.form.name = res.data.name;
 
         //回显示是否使用外链
@@ -606,7 +619,7 @@ export default {
         // this.cascaderKey += 1;
         // this.loadCascaderPath(this.form.city_arr_id,"xzqh");
 
-        //回显父级导航
+        //回显父级栏目
         this.form.pid_arr = JSON.parse(res.data.pid_arr);
         this.parentKey += 1;
         // this.loadCascaderPath(this.form.pid_arr,"fjdh");
@@ -616,9 +629,10 @@ export default {
         // this.departmentKey += 1;
         // this.loadCascaderPath(this.form.department_arr_id,"znbm");
 
-        //回显导航池标题，描述，关键词
+        //回显栏目池标题，描述，关键词
         this.form.seo_title = res.data.seo_title;
         this.form.seo_keywords = res.data.seo_keywords;
+        this.tags = res.data.seo_keywords?res.data.seo_keywords.split(','):[];
         this.form.seo_description = res.data.seo_description;
 
         //回显排序
@@ -665,7 +679,7 @@ export default {
             //汇报结果
             this.$message({
               type: 'success',
-              message: '已成功修改导航池信息！'
+              message: '已成功修改栏目池信息！'
             });
             //清空并退出
             this.closeWindow();
@@ -679,8 +693,14 @@ export default {
         }
       })
 
-    }
-    //编辑导航池 end ------------------------------------------------------------>
+    },
+    //关键词
+    updateTags(newTags) {
+            // this.foem.seo_keywords = newTags;
+            this.tags = newTags;
+            this.form.seo_keywords = newTags.join(',');
+    },
+    //编辑栏目池 end ------------------------------------------------------------>
   },
   mounted(){
     //1.获得初始数据

src/views/website/editNavigation.vue

@@ -92,11 +92,6 @@
               <el-input v-model="form.seo_title" autocomplete="off"></el-input>
             </div>
           </el-form-item>
-          <el-form-item label="排序：" :label-width="formLabelWidth" prop="sort" class="custom-align-right">
-            <div class="formLabelFloatBox">
-              <el-input v-model="form.sort" autocomplete="off" ></el-input>
-            </div>
-          </el-form-item>
           <el-form-item label="栏目关键词：" :label-width="formLabelWidth" prop="seo_keywords" class="custom-align-right">
             <div class="formLabelFloatBox">
               <inputTag  :initialTags="tags" @tags-updated="updateTags"/> 
@@ -104,10 +99,14 @@
               <!-- <el-input v-model="form.seo_keywords" autocomplete="off"></el-input> -->
             </div>
           </el-form-item>
-          
           <el-form-item label="栏目描述：" :label-width="formLabelWidth" prop="seo_description" class="custom-align-right">
             <el-input type="textarea" v-model="form.seo_description" class="custom-textarea"></el-input>
           </el-form-item>
+          <el-form-item label="排序：" :label-width="formLabelWidth" prop="sort" class="custom-align-right">
+            <div class="formLabelFloatBox">
+              <el-input v-model="form.sort" autocomplete="off" ></el-input>
+            </div>
+          </el-form-item>
         </div>
       </el-form>
       <div slot="footer" class="dialog-footer">