Ver código fonte

Merge branch 'pre_category_03_11_liu' into pre

rkljw 3 semanas atrás
pai
commit
eeebdf91c3

+ 35 - 44
src/views/website/categoryList.vue

@@ -6,7 +6,7 @@
         <el-col :span="8">
         <el-col :span="8">
           <div class="searchBox">
           <div class="searchBox">
             <div class="searchTitle">栏目名称:</div>
             <div class="searchTitle">栏目名称:</div>
-            <el-input v-model="search"   placeholder="请输入栏目名称"  :clearable="true"/>
+            <el-input v-model="getApiData.name"   placeholder="请输入栏目名称"  :clearable="true" @clear="onInputClear"/>
             <!-- <el-input placeholder="请输入栏目名称" autocomplete="off" v-model="getApiData.name" /> -->
             <!-- <el-input placeholder="请输入栏目名称" autocomplete="off" v-model="getApiData.name" /> -->
           </div>
           </div>
         </el-col>
         </el-col>
@@ -16,10 +16,10 @@
       <div>
       <div>
         <el-button type="primary" @click="addCategoryList">添加栏目名称</el-button>
         <el-button type="primary" @click="addCategoryList">添加栏目名称</el-button>
       </div>
       </div>
-      <!-- <div>
+      <div>
         <el-button @click="clearSearchList">重置</el-button>
         <el-button @click="clearSearchList">重置</el-button>
         <el-button type="primary" style="margin-right:20px" @click="getData('search')">搜索</el-button>
         <el-button type="primary" style="margin-right:20px" @click="getData('search')">搜索</el-button>
-      </div> -->
+      </div>
     </div>
     </div>
     <!--搜索功能 end------------------------------------------------------------>
     <!--搜索功能 end------------------------------------------------------------>
 
 
@@ -29,16 +29,17 @@
       <el-row>
       <el-row>
         <template>
         <template>
           <el-table 
           <el-table 
-          :data="tableData.filter(data => searchFilter(data, search))"
+          :data="tableData"
           style="width: 100%"
           style="width: 100%"
           row-key="id"
           row-key="id"
-          default-expand-all
+          :default-expand-all="isExpandAll"
           :tree-props="{children: 'children', hasChildren: 'hasChildren'}" 
           :tree-props="{children: 'children', hasChildren: 'hasChildren'}" 
-          :row-class-name="tableRowClassName">
+          >
             <el-table-column fixed prop="id" label="编号" width="150"></el-table-column>
             <el-table-column fixed prop="id" label="编号" width="150"></el-table-column>
             <el-table-column prop="name" label="栏目名称">
             <el-table-column prop="name" label="栏目名称">
               <template slot-scope="scope">
               <template slot-scope="scope">
-              <span :class="{ highlight: isHighlight(scope.row, search) }">{{ scope.row.name }}</span>
+                <span :class="{ highlight: isHighlight(scope.row, search) }" v-if="scope.row.pid==0">{{ scope.row.name }}</span>
+                <span :class="{ highlight: isHighlight(scope.row, search)}"  v-else>____{{ scope.row.name }}</span>
             </template>
             </template>
             </el-table-column>
             </el-table-column>
             <el-table-column label="是否外链" align="center">
             <el-table-column label="是否外链" align="center">
@@ -67,7 +68,7 @@
       </el-row>
       </el-row>
     </div>
     </div>
     <!--分页 start------------------------------------------------------------>
     <!--分页 start------------------------------------------------------------>
-    <!-- <div class="alignBox">
+    <div class="alignBox">
       <el-row>
       <el-row>
         <el-col :span="24">
         <el-col :span="24">
           <el-pagination :current-page="getApiData.page" @size-change="handleSizeChange"
           <el-pagination :current-page="getApiData.page" @size-change="handleSizeChange"
@@ -75,7 +76,7 @@
             :total="allCount"></el-pagination>
             :total="allCount"></el-pagination>
         </el-col>
         </el-col>
       </el-row>
       </el-row>
-    </div> -->
+    </div>
     <!--分页 end------------------------------------------------------------>
     <!--分页 end------------------------------------------------------------>
     <!--表格内容 end------------------------------------------------------------>
     <!--表格内容 end------------------------------------------------------------>
 
 
@@ -218,6 +219,7 @@ export default {
     let self = this;
     let self = this;
     //0.全局操作 end ------------------------------------------------------------>
     //0.全局操作 end ------------------------------------------------------------>
     return {
     return {
+      isExpandAll: false,
       search: '',
       search: '',
       tags: [],
       tags: [],
       //1.列表和分页相关 start ------------------------------------------------------------>
       //1.列表和分页相关 start ------------------------------------------------------------>
@@ -415,30 +417,20 @@ export default {
     }
     }
   },
   },
   methods: {
   methods: {
-    tableRowClassName({row, rowIndex}) {
-        if (row.pid == 0) {
-          return 'warning-row';
-        } 
-        return '';
-      },
-    searchFilter(data, search) {
-      if (!search) return true;
-      const lowerSearch = search.toLowerCase();
-      if (data.name.toLowerCase().includes(lowerSearch)) {
-        return true;
-      }
-      if (data.children && data.children.length > 0) {
-        for (const child of data.children) {
-          if (this.searchFilter(child, search)) {
-            return true;
-          }
-        }
-      }
-      return false;
+    onInputClear(){
+      this.isExpandAll = false;
+      this.getData();
     },
     },
+
     //1.列表和分页相关 start ------------------------------------------------------------>
     //1.列表和分页相关 start ------------------------------------------------------------>
     //1.1 开始请求列表信息方法
     //1.1 开始请求列表信息方法
     getData(type) {
     getData(type) {
+      if(type=='search'){
+        this.getApiData.page=1
+        this.isExpandAll = true;
+      }else{
+        this.isExpandAll = false;
+      }
       //搜索条件
       //搜索条件
       // if(this.getApiData.department_id.length>0){
       // if(this.getApiData.department_id.length>0){
       //   //网系只提交最后一个
       //   //网系只提交最后一个
@@ -450,9 +442,10 @@ export default {
       // }
       // }
       //如果是搜索,重新加载第一页
       //如果是搜索,重新加载第一页
   
   
-      this.$store.dispatch('pool/getCategoryList', {}).then(res => {
-        console.log("=============:",res.data)
-        this.tableData = res.data; //��与内容
+      this.$store.dispatch('pool/getCategoryList', this.getApiData).then(res => {
+        // console.log("=============:",res.data)
+        this.tableData = res.data.rows; //��与内容
+        this.allCount = res.data.total
       }).catch(() => {
       }).catch(() => {
         this.$message({
         this.$message({
           type: 'warning',
           type: 'warning',
@@ -495,17 +488,18 @@ export default {
       });
       });
     },
     },
     //1.3 直接跳转
     //1.3 直接跳转
-    // handleSizeChange(val) {
-    //   this.getApiData.page = val;
-    //   this.getData();
-    // },
-    // //1.4 点击分页
-    // handleCurrentChange(val) {
-    //   this.getApiData.page = val;
-    //   this.getData();
-    // },
+    handleSizeChange(val) {
+      this.getApiData.page = val;
+      this.getData();
+    },
+    //1.4 点击分页
+    handleCurrentChange(val) {
+      this.getApiData.page = val;
+      this.getData();
+    },
     //1.5 重置按钮
     //1.5 重置按钮
     clearSearchList() {
     clearSearchList() {
+      this.isExpandAll = false;
       this.tableData = [];
       this.tableData = [];
       this.getApiData.name = "";
       this.getApiData.name = "";
       // this.getApiData.department_id = [];
       // this.getApiData.department_id = [];
@@ -750,9 +744,6 @@ export default {
 ::v-deep .highlight {
 ::v-deep .highlight {
   background-color: yellow;
   background-color: yellow;
 }
 }
-::v-deep .el-table .warning-row {
-    background: oldlace ;
-  }
 //表单微调 start------------------------------------------------------------>*/
 //表单微调 start------------------------------------------------------------>*/
 ::v-deep .custom-form-item>.el-form-item__label {
 ::v-deep .custom-form-item>.el-form-item__label {
   line-height: 140px !important;
   line-height: 140px !important;

+ 15 - 9
src/views/website/editNavigation.vue

@@ -4,7 +4,7 @@
       <el-row>
       <el-row>
         <el-col :span="8">
         <el-col :span="8">
           <div class="searchBox">
           <div class="searchBox">
-            <div class="searchTitle">栏目名称:</div>
+            <div class="searchTitle">栏目名称:{{ isExpandAll }}</div>
             <el-input v-model="search"   placeholder="请输入栏目名称"  :clearable="true"/>
             <el-input v-model="search"   placeholder="请输入栏目名称"  :clearable="true"/>
             <!-- <el-input placeholder="请输入栏目名称" autocomplete="off" v-model="getApiData.name" /> -->
             <!-- <el-input placeholder="请输入栏目名称" autocomplete="off" v-model="getApiData.name" /> -->
           </div>
           </div>
@@ -12,9 +12,9 @@
       </el-row>
       </el-row>
     </div>
     </div>
     <div class="layerBoxNoBg">
     <div class="layerBoxNoBg">
-      <div>
+      <!-- <div>
         <el-button type="primary" @click="addCategoryList">添加栏目名称</el-button>
         <el-button type="primary" @click="addCategoryList">添加栏目名称</el-button>
-      </div>
+      </div> -->
       <!-- <div>
       <!-- <div>
         <el-button @click="clearSearchList">重置</el-button>
         <el-button @click="clearSearchList">重置</el-button>
         <el-button type="primary" style="margin-right:20px" @click="getData('search')">搜索</el-button>
         <el-button type="primary" style="margin-right:20px" @click="getData('search')">搜索</el-button>
@@ -73,14 +73,15 @@
             :data="tableData.filter(data => searchFilter(data, search))"
             :data="tableData.filter(data => searchFilter(data, search))"
             style="width: 100%"
             style="width: 100%"
             row-key="id"
             row-key="id"
-            default-expand-all
+            :default-expand-all="isExpandAll"
             :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
             :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
             :row-class-name="tableRowClassName"
             :row-class-name="tableRowClassName"
             >
             >
             <el-table-column fixed prop="category_id" label="编号" width="180"></el-table-column>
             <el-table-column fixed prop="category_id" label="编号" width="180"></el-table-column>
             <el-table-column prop="name" label="栏目名称">
             <el-table-column prop="name" label="栏目名称">
               <template slot-scope="scope">
               <template slot-scope="scope">
-                <span :class="{ highlight: isHighlight(scope.row, search) }">{{ scope.row.name }}</span>
+                <span :class="{ highlight: isHighlight(scope.row, search) }" v-if="scope.row.pid==0">{{ scope.row.name }}</span>
+                <span :class="{ highlight: isHighlight(scope.row, search)}"  v-else>____{{ scope.row.name }}</span>
               </template>
               </template>
             </el-table-column>
             </el-table-column>
             <el-table-column prop="alias" label="展示名称"></el-table-column>
             <el-table-column prop="alias" label="展示名称"></el-table-column>
@@ -188,8 +189,9 @@ export default {
     //0.全局操作 end ------------------------------------------------------------>
     //0.全局操作 end ------------------------------------------------------------>
 
 
     return {
     return {
+      isExpandAll: true,
       search: '',
       search: '',
-      tags: ['初始标签1', '初始标签2'],
+      tags: [],
       //1.列表和分页相关 start ------------------------------------------------------------>
       //1.列表和分页相关 start ------------------------------------------------------------>
       tableDivTitle:"栏目详情",
       tableDivTitle:"栏目详情",
       tableData: [],//列表
       tableData: [],//列表
@@ -451,6 +453,7 @@ export default {
     },
     },
     searchFilter(data, search) {
     searchFilter(data, search) {
       if (!search) return true;
       if (!search) return true;
+      this.isExpandAll = true
       const lowerSearch = search.toLowerCase();
       const lowerSearch = search.toLowerCase();
       if (data.name.toLowerCase().includes(lowerSearch)) {
       if (data.name.toLowerCase().includes(lowerSearch)) {
         return true;
         return true;
@@ -478,6 +481,12 @@ export default {
     this.getApiData.pageSize = this.$route.query.pageSize;
     this.getApiData.pageSize = this.$route.query.pageSize;
     //获取页面列表
     //获取页面列表
     this.getData();
     this.getData();
+  },
+  watch: {
+    search(newValue, oldValue) {
+      this.isExpandAll = true
+      console.log("====:",this.isExpandAll)
+    }
   }
   }
 }
 }
 </script>
 </script>
@@ -486,9 +495,6 @@ export default {
 ::v-deep .highlight {
 ::v-deep .highlight {
   background-color: yellow;
   background-color: yellow;
 }
 }
-::v-deep .el-table .warning-row {
-    background: oldlace ;
-  }
 //表单微调 start------------------------------------------------------------>*/
 //表单微调 start------------------------------------------------------------>*/
 ::v-deep .custom-form-item > .el-form-item__label {
 ::v-deep .custom-form-item > .el-form-item__label {
   line-height: 140px !important;
   line-height: 140px !important;