0.0.11

10-21保存

src/api/pool.js

@@ -1,6 +1,7 @@
 import request from '@/utils/request'
 
-// 获取网站管理列表 //注意，post请求使用data get请求使用params
+//1.网站管理 start ------------------------------------->
+//1.1 获取网站管理列表 //注意，post请求使用data get请求使用params
 export function getWebList(params) {
   return request({
     url: '/website/getWebsiteList',
@@ -9,7 +10,7 @@ export function getWebList(params) {
   })
 }
 
-// 删除网站
+//1.2 删除网站
 export function deleteWebList(data) {
   return request({
     url: '/website/delWebsite',
@@ -18,7 +19,7 @@ export function deleteWebList(data) {
   })
 }
 
-//查询所有网系
+//1.3 查询所有网系
 export function getwebsiteColumn(params) {
   return request({
     url: '/website/getWebsiteColumn',
@@ -27,7 +28,7 @@ export function getwebsiteColumn(params) {
   })
 }
 
-//查询城市列表
+//1.4 查询城市列表
 export function getcityList(params) {
   return request({
     url: '/public/getDistrictList',
@@ -36,7 +37,7 @@ export function getcityList(params) {
   })
 }
 
-//上传文件
+//1.5 上传文件
 export function uploadFile(data) {
   return request({
     url: '/public/uploadFile',
@@ -45,7 +46,7 @@ export function uploadFile(data) {
   })
 }
 
-//获取模板列表
+//1.6 获取模板列表
 export function getTemplate(params) {
   return request({
     url: '/website/getTemplate',
@@ -54,7 +55,7 @@ export function getTemplate(params) {
   })
 }
 
-//添加网站
+//1.7 添加网站
 export function addWebsite(data) {
   return request({
     url: '/website/addWebsite',
@@ -63,7 +64,7 @@ export function addWebsite(data) {
   })
 }
 
-//获取网站详情
+//1.8 获取网站详情
 export function getWebsiteInfo(params) {
   return request({
     url: '/website/getWebsiteInfo',
@@ -72,7 +73,7 @@ export function getWebsiteInfo(params) {
   })
 }
 
-//编辑网站
+//1.9 编辑网站
 export function updateWebsite(data) {
   return request({
     url: '/website/updateWebsite',
@@ -80,3 +81,65 @@ export function updateWebsite(data) {
     data
   })
 }
+//网站管理 end ------------------------------------->
+
+//2.导航池 start ------------------------------------->
+//2.1 获取导航池列表
+export function getCategoryList(params) {
+  return request({
+    url: '/news/getCategoryList',
+    method: 'get',
+    params
+  })
+}
+
+//2.2 删除导航池
+export function delCategory(data) {
+  return request({
+    url: '/news/delCategory',
+    method: 'post',
+    data
+  })
+}
+
+//2.3 添加导航池
+export function addCategory(data) {
+  return request({
+    url: '/news/addCategory',
+    method: 'post',
+    data
+  })
+}
+
+//2.4 获取导航池信息
+export function getCategoryInfo(params) {
+  return request({
+    url: '/news/getCategoryInfo',
+    method: 'get',
+    params
+  })
+}
+
+//2.5 更新导航池
+export function updateCategory(data) {
+  return request({
+    url: '/news/updateCategory',
+    method: 'post',
+    data
+  })
+}
+
+//2.6 获取职能部门
+export function getDepartment(params) {
+  return request({
+    url: '/public/getDepartment',
+    method: 'get',
+    params
+  })
+}
+
+//导航池 end ------------------------------------->
+
+//3.网站导航 start ------------------------------------->
+
+//网站导航 end ------------------------------------->

src/router/index.js

@@ -108,6 +108,22 @@ export const constantRoutes = [
       }
     ]
   },
+  {
+    path: '/categoryList',
+    component: Layout,
+    children: [
+      {
+        name: '', //直接就是根目录所以为空
+        path: '',
+        component: () => import('@/views/website/categoryList'),
+        meta: {
+          title: '导航池', // 设置菜单和面包屑显示的标题
+          hidden: true, // 不在侧边菜单显示
+          breadcrumb: true // 强制在面包屑中显示
+        }
+      }
+    ]
+  },
   // {
   //   path: '/documentation',
   //   component: Layout,

src/store/modules/pool.js

@@ -1,4 +1,7 @@
-import { getWebList,deleteWebList,getwebsiteColumn,getcityList,uploadFile,getTemplate,addWebsite,getWebsiteInfo,updateWebsite} from '@/api/pool'
+import { getWebList,deleteWebList,getwebsiteColumn,
+getcityList,uploadFile,getTemplate,addWebsite,getWebsiteInfo,
+updateWebsite,getDepartment,getCategoryList,delCategory,
+getCategoryInfo} from '@/api/pool'
 
 const state = {
 
@@ -9,6 +12,7 @@ const mutations = {
 }
 
 const actions = {
+  //1.网站列表 end ---------------------------------------->
   //获取网站管理列表
   getWebList({commit},data) {
     return new Promise((resolve, reject) => {
@@ -79,7 +83,7 @@ const actions = {
       })
     })
   },
-  //添加网站
+  //获取网站详情
   getWebsiteInfo({commit},data) {
     return new Promise((resolve, reject) => {
       getWebsiteInfo(data).then(response => {
@@ -98,15 +102,54 @@ const actions = {
         reject(error)
       })
     })
-  }
+  },
+  //网站列表 end ---------------------------------------->
 
+  //2.导航池 start ---------------------------------------->
+  //获得导航池列表
+  getCategoryList({commit},data) {
+    return new Promise((resolve, reject) => {
+      getCategoryList(data).then(response => {
+        resolve(response)
+      }).catch(error => {
+        reject(error)
+      })
+    })
+  },
+  //获得职能部门
+  getDepartment({commit},data) {
+    return new Promise((resolve, reject) => {
+      getDepartment(data).then(response => {
+        resolve(response)
+      }).catch(error => {
+        reject(error)
+      })
+    })
+  },
+  //删除导航池
+  delCategory({commit},data) {
+    return new Promise((resolve, reject) => {
+      delCategory(data).then(response => {
+        resolve(response)
+      }).catch(error => {
+        reject(error)
+      })
+    })
+  },
+  //获取导航池详情
+  getCategoryInfo({commit},data) {
+    return new Promise((resolve, reject) => {
+      getCategoryInfo(data).then(response => {
+        resolve(response)
+      }).catch(error => {
+        reject(error)
+      })
+    })
+  },
 
 }
 
 
-
-
-
 export default {
   namespaced: true,
   state,

src/views/website/WebsiteList.vue

@@ -62,7 +62,7 @@
       </el-row>
     </div>
     <!--分页 end------------------------------------------------------------>
-    <!--表格 end------------------------------------------------------------>
+    <!--表格内容 end------------------------------------------------------------>
 
 
     <!--弹出框1：外部表单弹出框 start------------------------------------------------------------>
@@ -120,7 +120,7 @@
             <el-button type="danger" icon="el-icon-delete" circle size="mini" @click="deleteUrlInput(4)" class="formLabelDelIcon"></el-button>
           </div>
         </el-form-item>
-        <el-form-item label="上级网系：" :label-width="formLabelWidth">
+        <el-form-item label="上级网系：" :label-width="formLabelWidth" prop="website_column_arr_id">
           <el-cascader v-model="form.website_column_arr_id" :props="{checkStrictly:true}" :options="website_column_arr" @change="AppointWebsiteColumn"></el-cascader>
         </el-form-item>
         <el-form-item label="城市：" :label-width="formLabelWidth">
@@ -155,7 +155,7 @@
       <div slot="footer" class="dialog-footer">
         <div>
           <el-button @click="closeWindow">取 消</el-button>
-          <el-button type="warning" @click="editToServe" v-if="editBtn==true">修改</el-button>
+          <el-button type="warning" @click="editToServe" v-if="editBtn==true">编辑</el-button>
           <el-button type="primary" @click="addToServe" v-else>提交</el-button>
         </div>
       </div>
@@ -186,7 +186,13 @@ export default {
         callback();
       }
     }
-
+    const validateColumn = (rule,value,callback) => {
+      if (value.length === 0) {
+          callback(new Error('必须选择一个上级网系！'))
+      } else {
+          callback()
+      }
+    }
     let self = this;
     //0.全局操作 end ------------------------------------------------------------>
     return {
@@ -203,15 +209,46 @@ export default {
       allCount:0,//总条数
       //分页相关 end ------------------------------------------------------------>
 
-      //2.弹出框设置 start ------------------------------------------------------------>
+      //2.搜索 start ------------------------------------------------------------>
+      searchCascaderKey:0,//搜索栏用的key
+      SearchCityData: {
+        checkStrictly: true,
+        lazy: true,
+        async lazyLoad (node, resolve) {
+          const { level, data } = node;
+          if (data && data.children && data.children.length !== 0) {
+            return resolve(node)
+          }
+          console.log(level)
+          let parentId = level == 0 ? 0 : data.value
+          let parames = {
+            'pid':parentId
+          }
+          self.$store.dispatch('pool/getcityList',parames).then(res=> {
+            if (res.data) {
+              const nodes = res.data.map(item => ({
+                value: item.id,
+                label: item.name,
+                leaf: level >= 3,
+                children: []
+              }))
+              resolve(nodes)
+            }
+          })
+        }
+      },
+      //2.搜索 end ------------------------------------------------------------>
+
+
+      //3.弹出框设置 start ------------------------------------------------------------>
       windowStatus:false, //显示第一层弹窗
       innerVisible:false, //显示第二层弹窗
       formLabelWidth: '120px',//表单的长度
       editBtn:false,//当显示编辑按钮的时候，就不显示提交
       //弹出框设置 start ------------------------------------------------------------>
 
-      //3.弹出框中的表单设置 start ------------------------------------------------------------>
-      //3.1 表单收集的数据
+      //4.弹出框中的表单设置 start ------------------------------------------------------------>
+      //4.1 表单收集的数据
       form: {
         website_name: '',//需要提交的网站名称
         website_url:[//需要绑定的网站地址
@@ -229,7 +266,7 @@ export default {
         description:"",//需要提交的网站描述
         template_id:""//选择的网站皮肤
       },
-      //3.2 表单验证规则
+      //4.2 表单验证规则
       formRules: {
         //网站名称不能为空
         website_name:[{required:true,trigger:'blur',validator:validateEmpty}],
@@ -238,14 +275,16 @@ export default {
           {required: true, message:'至少要填写一个网站地址！',trigger:'blur'},
           {validator: this.validateWebsiteUrl,trigger:'blur'}
         ],
+        //网系不能为空 注意，因为是select框，只有提交的时候才会验证
+        website_column_arr_id: [{type:'array',required:true,trigger:'change',message:'必须选择一个网系！',validator:validateColumn}],
         //网站标题，关键词，描述不能为空
         title:[{required:true,trigger:'blur',validator:validateEmpty}],
         keywords:[{required:true,trigger:'blur',validator:validateEmpty}],
         description:[{required:true,trigger:'blur',validator:validateEmpty}],
       },
-      //3.3 通过api获的的数据 弹窗
+      //4.3 通过api获的的数据 弹窗
       website_column_arr:[],//api获得的网系列表
-      searchCascaderKey:0,//搜索栏用的key
+      //城市列表
       cascaderKey:0,//弹窗用的key
       cityData: {
         checkStrictly: true,
@@ -273,36 +312,9 @@ export default {
           })
         }
       },
-      //搜索列
-      SearchCityData: {
-        checkStrictly: true,
-        lazy: true,
-        async lazyLoad (node, resolve) {
-          const { level, data } = node;
-          if (data && data.children && data.children.length !== 0) {
-            return resolve(node)
-          }
-          console.log(level)
-          let parentId = level == 0 ? 0 : data.value
-          let parames = {
-            'pid':parentId
-          }
-          self.$store.dispatch('pool/getcityList',parames).then(res=> {
-            if (res.data) {
-              const nodes = res.data.map(item => ({
-                value: item.id,
-                label: item.name,
-                leaf: level >= 3,
-                children: []
-              }))
-              resolve(nodes)
-            }
-          })
-        }
-      },
-      //3.4 上传logo图片
+      //4.4 上传logo图片
       logoUrl:'',
-      //3.5 模板列表
+      //4.5 模板列表
       TemplateList:[],
       getTemplateData:{
         template_class_id:1,//模板类型，暂时为1
@@ -353,7 +365,7 @@ export default {
     },
     //1.2 删除内容
     deleteData(id){
-      this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
+      this.$confirm('此操作将永久删除该条数据, 是否继续?', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
         type: 'warning'

src/views/website/categoryList.vue

@@ -0,0 +1,491 @@
+<template>
+  <div class="mainBox">
+    <!--搜索功能 start------------------------------------------------------------>
+    <div class="layerBox_search">
+      <el-row>
+        <el-col :span="8">
+          <div class="searchBox">
+            <div class="searchTitle">导航池名称：</div>
+            <el-input placeholder="请输入导航池名称" autocomplete="off" v-model="getApiData.name"/>
+          </div>
+        </el-col>
+        <el-col :span="8">
+          <div class="searchBox">
+            <div class="searchTitle">行政职能部门：</div>
+            <el-cascader :key="searchDepartmentKey" v-model="getApiData.department_id" placeholder="选择导航池所属行政区划" :props="searchDepartmentData" filterable clearable></el-cascader>
+          </div>
+        </el-col>
+        <el-col :span="8">
+          <div class="searchBox">
+            <div class="searchTitle">行政区划：</div>
+            <el-cascader :key="searchCascaderKey" v-model="getApiData.city_id" placeholder="选择导航池所属行政区划" :props="searchCityData" filterable clearable></el-cascader>
+          </div>
+        </el-col>
+      </el-row>
+    </div>
+    <div class="layerBoxNoBg">
+      <el-button>重置</el-button>
+      <el-button type="primary" style="margin-right:20px"  @click="getData('search')">搜索</el-button>
+      <el-button type="success" icon="el-icon-link" @click="openWindow">添加导航池名称</el-button>
+    </div>
+    <!--搜索功能 end------------------------------------------------------------>
+
+    <!--表格内容 start------------------------------------------------------------>
+    <div class="layerBox">
+      <el-row>
+        <template>
+          <el-table :data="tableData" style="width: 100%">
+            <el-table-column fixed prop="id" label="编号" width="50"></el-table-column>
+            <el-table-column prop="name" label="导航池名称" width="140"></el-table-column>
+            <el-table-column prop="department_name" label="行政职能部门" width="140"></el-table-column>
+            <el-table-column prop="city_name" label="行政区划" width="170"></el-table-column>
+            <el-table-column prop="created_at" label="创建时间" width="170"></el-table-column>
+            <el-table-column prop="updated_at" label="修改时间" width="170"></el-table-column>
+            <el-table-column fixed="right" label="操作" width="120">
+              <template slot-scope="scope">
+                <el-button @click.native.prevent="deleteData(scope.row.id, tableData)" type="text" size="small">移除</el-button>
+                <el-button @click.native.prevent="getDataMain(scope.row.id, tableData)" type="text" size="small">编辑</el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+        </template>
+      </el-row>
+    </div>
+    <!--分页 start------------------------------------------------------------>
+    <div class="layerBox alignBox">
+      <el-row>
+        <el-col :span="24">
+          <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :page-size="10" layout="total, prev, pager, next, jumper" :total="allCount"></el-pagination>
+        </el-col>
+      </el-row>
+    </div>
+    <!--分页 end------------------------------------------------------------>
+    <!--表格内容 end------------------------------------------------------------>
+
+    <!--弹出框 start------------------------------------------------------------>
+    <el-dialog title="添加导航池名称" :visible.sync="windowStatus">
+      <el-form :model="form">
+        <el-form-item label="导航池名称：" :label-width="formLabelWidth">
+          <el-input v-model="form.name" autocomplete="off"></el-input>
+          <el-checkbox v-model="show_url">引用外链</el-checkbox>
+        </el-form-item>
+        <div v-if="show_url==true">
+          <el-form-item label="外链地址：" :label-width="formLabelWidth">
+            <el-input v-model="form.web_url" autocomplete="off"></el-input>
+          </el-form-item>
+        </div>
+        <div v-else>
+          <el-form-item label="关联职能部门：" :label-width="formLabelWidth">
+            <el-cascader :key="departmentKey" v-model="form.department_arr_id" placeholder="选择您要绑定的职能部门" :props="departmentData" filterable clearable></el-cascader>
+          </el-form-item>
+          <el-form-item label="关联行政区划：" :label-width="formLabelWidth">
+            <el-cascader :key="cascaderKey" v-model="form.city_arr_id" placeholder="选择您要绑定行政区划" :props="cityData" filterable clearable></el-cascader>
+          </el-form-item>
+          <el-form-item label="父级导航：" :label-width="formLabelWidth">
+
+          </el-form-item>
+          <el-form-item label="导航标题：" :label-width="formLabelWidth">
+            <el-input v-model="form.seo_title" autocomplete="off"></el-input>
+          </el-form-item>
+          <el-form-item label="导航关键词：" :label-width="formLabelWidth">
+            <el-input v-model="form.seo_keywords" autocomplete="off"></el-input>
+          </el-form-item>
+          <el-form-item label="导航描述：" :label-width="formLabelWidth">
+            <el-input type="textarea" v-model="form.seo_description"></el-input>
+          </el-form-item>
+          <el-form-item label="排序：" :label-width="formLabelWidth">
+            <el-input v-model="form.sort" autocomplete="off"></el-input>
+          </el-form-item>
+        </div>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="closeWindow">取 消</el-button>
+        <el-button type="warning" @click="" v-if="editBtn==true">编辑</el-button>
+        <el-button type="primary" @click="" v-else>提交</el-button>
+      </div>
+    </el-dialog>
+    <!--弹出框 end------------------------------------------------------------>
+
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    //0.全局操作 start ------------------------------------------------------------>
+    let self = this;
+    //0.全局操作 end ------------------------------------------------------------>
+
+    return {
+      //1.列表和分页相关 start ------------------------------------------------------------>
+      tableData:[],//内容
+      allCount:0,//总条数
+      editId:0,//要修改的网站id
+      getApiData:{
+        name:"",//导航池名称查询
+        department_id:[],//行政职能部门id
+        city_id:[],//行政区划
+        page:1,//当前是第几页
+        pageSize:10,//一共多少条
+      },
+      //列表和分页相关 end ------------------------------------------------------------>
+
+      //2.搜索相关 start ------------------------------------------------------------>
+      //行政职能部门
+      searchDepartmentKey:0, //列表缓存key
+      searchDepartmentData: {
+        checkStrictly: true,
+        lazy: true,
+        async lazyLoad (node, resolve) {
+          const { level, data } = node;
+          if (data && data.children && data.children.length !== 0) {
+            return resolve(node)
+          }
+          console.log(level)
+          let parentId = level == 0 ? 0 : data.value
+          let parames = {
+            'pid':parentId
+          }
+          self.$store.dispatch('pool/getDepartment',parames).then(res=> {
+            if (res.data) {
+              const nodes = res.data.map(item => ({
+                value: item.id,
+                label: item.name,
+                leaf: level >= 3,
+                children: []
+              }))
+              resolve(nodes)
+            }
+          })
+        }
+      },
+      //获取城市列表
+      searchCascaderKey:0, //列表缓存key
+      searchCityData: {
+        checkStrictly: true,
+        lazy: true,
+        async lazyLoad (node, resolve) {
+          const { level, data } = node;
+          if (data && data.children && data.children.length !== 0) {
+            return resolve(node)
+          }
+          console.log(level)
+          let parentId = level == 0 ? 0 : data.value
+          let parames = {
+            'pid':parentId
+          }
+          self.$store.dispatch('pool/getcityList',parames).then(res=> {
+            if (res.data) {
+              const nodes = res.data.map(item => ({
+                value: item.id,
+                label: item.name,
+                leaf: level >= 3,
+                children: []
+              }))
+              resolve(nodes)
+            }
+          })
+        }
+      },
+      //搜索相关 end ------------------------------------------------------------>
+
+      //3.弹出框设置 start ------------------------------------------------------------>
+      windowStatus:false, //显示弹出框
+      formLabelWidth: '120px',
+      show_url:false, //是否显示外链输入框
+      editBtn:false,//当显示编辑按钮的时候，就不显示提交
+      //弹出框设置 end ------------------------------------------------------------>
+
+      //4.弹出框中的表单设置 start ------------------------------------------------------------>
+      //4.1表单收集的数据
+      form: {
+        name: '',//导航池名称
+        is_url:0,//是否为外链，0=否 1=是
+        web_url:"",//外链地址
+        department_arr_id:[],//职能部门
+        city_arr_id:[],//行政区划
+        sort:0,//排序
+        pid:2,
+        seo_title:"",//标题
+        seo_keywords:"",//关键词
+        seo_description:"",//描述
+        pid_arr:[]//父级导航
+      },
+      //获取城市列表
+      cascaderKey:0,//弹窗用的key
+      cityData: {
+        checkStrictly: true,
+        lazy: true,
+        async lazyLoad (node, resolve) {
+          const { level, data } = node;
+          if (data && data.children && data.children.length !== 0) {
+            return resolve(node)
+          }
+          console.log(level)
+          let parentId = level == 0 ? 0 : data.value
+          let parames = {
+            'pid':parentId
+          }
+          self.$store.dispatch('pool/getcityList',parames).then(res=> {
+            if (res.data) {
+              const nodes = res.data.map(item => ({
+                value: item.id,
+                label: item.name,
+                leaf: level >= 3,
+                children: []
+              }))
+              resolve(nodes)
+            }
+          })
+        }
+      },
+      //获取职能部门
+      departmentKey:0,//弹窗用的key
+      departmentData: {
+        checkStrictly: true,
+        lazy: true,
+        async lazyLoad (node, resolve) {
+          const { level, data } = node;
+          if (data && data.children && data.children.length !== 0) {
+            return resolve(node)
+          }
+          console.log(level)
+          let parentId = level == 0 ? 0 : data.value
+          let parames = {
+            'pid':parentId
+          }
+          self.$store.dispatch('pool/getDepartment',parames).then(res=> {
+            if (res.data) {
+              const nodes = res.data.map(item => ({
+                value: item.id,
+                label: item.name,
+                leaf: level >= 3,
+                children: []
+              }))
+              resolve(nodes)
+            }
+          })
+        }
+      },
+      //弹出框中的表单设置 end ------------------------------------------------------------>
+
+    }
+  },
+  methods: {
+    //1.列表和分页相关 start ------------------------------------------------------------>
+    //1.1 开始请求列表信息方法
+    getData(type){
+      //搜索条件
+      // if(this.getApiData.department_id.length>0){
+      //   //网系只提交最后一个
+      //   this.getApiData.department_id = this.getApiData.department_id[this.getApiData.department_id.length - 1];
+      // }else{
+      //   this.getApiData.department_id = "";
+      // }
+      // if(this.getApiData.city_id.length>0){
+      //   //城市id只提交最后一个
+      //   this.getApiData.city_id = this.getApiData.city_id[this.getApiData.city_id.length - 1];
+      // }else{
+      //   this.getApiData.city_id = "";
+      // }
+
+      //如果是搜索，重新加载第一页
+      if(type=="search"){
+        this.getApiData.page = 1;
+      }
+
+      this.$store.dispatch('pool/getCategoryList',this.getApiData).then(res=> {
+        this.tableData = res.data.rows; //给与内容
+        this.allCount = res.data.count; //给与总条数
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '网络错误，请重试！'
+        });
+      })
+    },
+    //1.2 删除内容
+    deleteData(id){
+      this.$confirm('此操作将永久删除该条数据, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        console.log("当前删除：" + id)
+        this.$store.dispatch('pool/delCategory',{id:id}).then(res=> {
+          if(res.code==200){
+            this.$message({
+              type: 'success',
+              message: '删除成功!'
+            });
+          }else if(res.code==0){
+            this.$message({
+              type: 'info',
+              message: res.message
+            });
+          }
+          this.getData();
+        }).catch(() => {
+          this.$message({
+            type: 'info',
+            message: '网络错误，请重试！'
+          });
+        })
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消删除'
+        });
+      });
+    },
+    //1.3 直接跳转
+    handleSizeChange(val) {
+      this.getApiData.page = val;
+      this.getData();
+    },
+    //1.4 点击分页
+    handleCurrentChange(val) {
+      this.getApiData.page = val;
+      this.getData();
+    },
+    //列表和分页相关 end ------------------------------------------------------------>
+
+    //添加导航池 start ------------------------------------------------------------>
+
+    //添加导航池 end ------------------------------------------------------------>
+
+    //2.弹出框设置 start ------------------------------------------------------------>
+    //2.1 打开弹出框
+    openWindow() {
+      //this.clearToServe();
+      this.windowStatus = true;
+    },
+    //2.2 关闭弹出框
+    closeWindow(){
+      this.windowStatus = false;
+      //this.clearToServe();
+    },
+    //弹出框设置 end ------------------------------------------------------------>
+
+
+    //编辑导航池 start ------------------------------------------------------------>
+    getDataMain(id){
+      //先清空窗口
+      //this.clearToServe()
+      //打开输入窗口
+      this.openWindow();
+      //添加修改id
+      this.editId = id;
+
+      //获取网站详情
+      this.$store.dispatch('pool/getCategoryInfo',{id:id}).then(res=> {
+        //清除错误状态
+        //this.$refs.form.clearValidate();
+        console.log(res)
+        //回显导航池名称
+        this.form.name = res.data.name;
+
+        //回显行政区划
+        this.form.city_arr_id = res.data.city_arr_id;
+        //当cascaderKey的值改变的时候 级联选择器会重置里面的内容
+        this.cascaderKey += 1;
+        this.loadCascaderPath(this.form.city_arr_id);
+
+        //回显导航池标题，描述，关键词
+        this.form.seo_title = res.data.seo_title;
+        this.form.seo_keywords = res.data.seo_keywords;
+        this.form.seo_description = res.data.seo_description;
+
+        //回显排序
+        this.form.sort = res.data.sort;
+
+      })
+      this.editBtn = true;//显示编辑按钮
+    },
+    //回显行政区划
+    async loadCascaderPath(path) {
+      for (let i = 0; i < path.length; i++) {
+        const parentId = path[i - 1] || 0; // 获取当前层级的父级ID
+        const level = i; // 当前层级的索引
+        await this.$store.dispatch('pool/getcityList', { pid: parentId })
+          .then((res) => {
+            const nodes = res.data.map(item => ({
+              value: item.id,
+              label: item.name,
+              leaf: level >= 3, // 这里假设4层结构，设置叶子节点标记
+            }));
+            // 将数据传递到 resolve，通知 cascader 这一层的数据加载完毕
+            if (level === path.length - 1) {
+              this.form.city_arr_id = path;
+            }
+          });
+      }
+    },
+
+    //编辑导航池 end ------------------------------------------------------------>
+  },
+  mounted(){
+    //1.获得初始数据
+    this.getData();
+    //2.获取所有网系
+    //this.getwebsiteColumn();
+    //本地转换id为文字
+    //console.log(getLocationNameById("110000"))
+  }
+}
+</script>
+
+<style scoped lang="less">
+  .layerBox_search {
+    margin:30px 30px 10px 30px;
+    background: #fff;
+    border-radius: 8px;
+    padding: 20px 20px 0 20px;
+    box-sizing: border-box;
+    overflow:hidden;
+    .el-row {
+      margin-bottom:20px;
+    }
+    .searchTitle {
+      font-size:14px;
+      white-space:nowrap;
+    }
+    .searchBox {
+      display:flex;
+      align-items: center;
+      padding-right:20px;
+    }
+  }
+  .layerBox {
+    margin:30px;
+    background: #fff;
+    border-radius: 8px;
+    padding: 20px 20px 20px 20px;
+    box-sizing: border-box;
+  }
+  .layerBoxNoBg {
+    margin:0 30px 0 30px;
+    text-align: right;
+  }
+  .alignBox {
+    text-align:center
+  }
+  /*弹出窗口*/
+  .windowTitle {
+    display:flex;
+    padding-bottom:20px;
+    font-size:16px;
+    font-weight: bold;
+    box-sizing: border-box;
+    margin-bottom: 20px;
+    .webNavTitle {
+      width:120px;
+      text-align:right;
+      margin-right:20px;
+    }
+    .webNavTitleRight {
+      width:100%;
+      text-align: center;
+    }
+  }
+</style>

src/views/website/components/multiLevelSelector.vue

@@ -0,0 +1,8 @@
+<template>
+</template>
+
+<script>
+</script>
+
+<style>
+</style>