食谱制作页面的快捷列表关键字搜索

stdiet-admin/src/main/java/com/stdiet/web/controller/custom/SysDishesController.java

@@ -71,6 +71,7 @@ public class SysDishesController extends BaseController {
     public AjaxResult getMenuTypes(@PathVariable("id") Long id) {
         JSONObject object = new JSONObject();
         object.put("type", sysDishesService.getDishesMenuTypeById(id));
+        object.put("className", sysDishesService.getDishClassNameById(id));
         return AjaxResult.success(object);
     }
 

stdiet-custom/src/main/java/com/stdiet/custom/mapper/SysDishesMapper.java

@@ -3,9 +3,11 @@ package com.stdiet.custom.mapper;
 import com.stdiet.custom.domain.SysDishes;
 import com.stdiet.custom.domain.SysDishesIngredient;
 import com.stdiet.custom.domain.SysPhysicalSignsObj;
+import org.apache.ibatis.annotations.Param;
 
 import java.util.ArrayList;
 import java.util.List;
+import java.util.Map;
 
 /**
  * 菜品Mapper接口
@@ -80,4 +82,12 @@ public interface SysDishesMapper {
 
     int deleteDishesNotRecByDishesId(Long dishesId);
 
+
+    /**
+     * 根据菜品ID查询大类小类名称
+     * @param dishId
+     * @return
+     */
+    String getDishClassNameById(@Param("dishId")Long dishId);
+
 }

stdiet-custom/src/main/java/com/stdiet/custom/service/ISysDishesService.java

@@ -1,6 +1,8 @@
 package com.stdiet.custom.service;
 
 import java.util.List;
+import java.util.Map;
+
 import com.stdiet.custom.domain.SysDishes;
 import com.stdiet.custom.domain.SysDishesIngredient;
 import com.stdiet.custom.domain.SysIngredient;
@@ -66,4 +68,11 @@ public interface ISysDishesService
 
     public String getDishesMenuTypeById(Long id);
 
+    /**
+     * 根据菜品ID查询大类小类名称
+     * @param dishId
+     * @return
+     */
+    String getDishClassNameById(Long dishId);
+
 }

stdiet-custom/src/main/java/com/stdiet/custom/service/impl/SysDishesServiceImpl.java

@@ -10,6 +10,7 @@ import org.springframework.stereotype.Service;
 
 import java.util.ArrayList;
 import java.util.List;
+import java.util.Map;
 
 /**
  * 菜品Service业务层处理
@@ -183,4 +184,15 @@ public class SysDishesServiceImpl implements ISysDishesService {
         return sysDishesMapper.getDishesMenuTypeById(id);
     }
 
+
+    /**
+     * 根据菜品ID查询大类小类名称
+     * @param dishId
+     * @return
+     */
+    @Override
+    public String getDishClassNameById(Long dishId){
+        return sysDishesMapper.getDishClassNameById(dishId);
+    }
+
 }

stdiet-custom/src/main/resources/mapper/custom/SysDishesMapper.xml

@@ -207,4 +207,12 @@
         delete from sys_dishes_not_rec where dishes_id=#{dishesId}
     </delete>
 
+    <!-- 根据菜品ID查询菜品对应大类小类名称 -->
+    <select id="getDishClassNameById" parameterType="Long" resultType="String">
+        select concat(IFNULL(big.dict_label,''),'/',IFNULL(small.dict_label,'')) as className from sys_dishes dish
+        LEFT JOIN (SELECT dict_label, dict_value FROM sys_dict_data WHERE dict_type = 'dish_class_big') AS big ON big.dict_value = dish.big_class
+        LEFT JOIN (SELECT dict_label, dict_value FROM sys_dict_data WHERE dict_type = 'dish_class_small') AS small ON small.dict_value = dish.small_class
+        where dish.id = #{dishId} and dish.del_flag = 0
+    </select>
+
 </mapper>

stdiet-ui/src/api/custom/recipes.js

@@ -45,3 +45,17 @@ export function replaceMenuApi(data) {
     data
   });
 }
+
+/**
+ * 根据菜品ID查询大类小类名称
+ * @param dishId
+ */
+export function getDishClassNameById(dishId) {
+  return request({
+    url: "/custom/recipes/getDishClassNameById",
+    method: "get",
+    params: {'dishId':dishId}
+  });
+}
+
+

stdiet-ui/src/store/modules/recipes.js

@@ -555,6 +555,7 @@ const actions = {
             id: new Date().getTime(),
             name: tarDishes.name,
             type: response.data.type.split(",").sort(),
+            className: response.data.className,  //大类小类名称
             data: tarDishes
           }).then(() => {
             window.postMessage(

stdiet-ui/src/utils/shortCutUtils.js

@@ -1,8 +1,19 @@
-export function getShortCut() {
+export function getShortCut(key) {
   return new Promise((res, rej) => {
     try {
       const data = JSON.parse(localStorage.getItem("shortCut") || "[]");
-      res(data);
+      //关键字检索
+      if(key != undefined && key != null && key != ""){
+          const resultData = [];
+          data.forEach((item,index) => {
+              if(item.name.indexOf(key) != -1 || (item.className != undefined && item.className != null && item.className.indexOf(key) != -1)){
+                resultData.push(item);
+              }
+          });
+          res(resultData);
+      }else{
+        res(data);
+      }
     } catch (error) {
       rej(error);
     }
@@ -35,6 +46,19 @@ export async function removeShortCut(id) {
   });
 }
 
+export async function removeMuchShortCut(ids) {
+  const shortCutList = await getShortCut();
+  return new Promise((res, rej) => {
+    try {
+      const newShortCutList = shortCutList.filter(obj => ids.indexOf(obj.id) == -1);
+      localStorage.setItem("shortCut", JSON.stringify(newShortCutList));
+      res();
+    } catch (error) {
+      rej(error);
+    }
+  });
+}
+
 export async function editShortCut(data) {
   const shortCutList = await getShortCut();
   return new Promise((res, rej) => {

stdiet-ui/src/views/custom/recipesBuild/InfoView/ShortCutCom/index.vue

@@ -1,14 +1,32 @@
 <template>
   <div class="short_cut_com_wrapper">
-    <div class="header">
+    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
-      <el-button icon="el-icon-refresh" size="mini" @click="getList" circle />
+      <el-form-item label="关键词" prop="key" >
-    </div>
+        <el-input
+          v-model.trim="queryParams.key"
+          placeholder="请输入名称/种类"
+          clearable
+          @clear="getList"
+          @keyup.native="getList"
+          size="small"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="cyan" icon="el-icon-search" size="mini" @click="getList">搜索</el-button>
+      </el-form-item>
+    </el-form>
+    
+      <div class="header">
+        <el-button icon="el-icon-search" size="mini" @click="showSearch = !showSearch" circle :title="showSearch ? '隐藏搜索' : '显示搜索'"/>
+        <el-button icon="el-icon-refresh" size="mini" @click="getList" circle title="刷新"/>
+        <el-button icon="el-icon-delete" size="mini" circle :title="'清空快捷列表'" @click="handleOnMuchDelete"/>
+      </div>
     <el-table
       :data="dataList"
       ref="shortCutTable"
       highlight-current-row
       @current-change="handleOnCurrentChange"
-      height="800"
+      height="700"
     >
       <el-table-column prop="name" label="对象" align="center">
         <template slot-scope="scope">
@@ -95,6 +113,7 @@ import {
   getShortCut,
   removeShortCut,
   editShortCut,
+  removeMuchShortCut
 } from "@/utils/shortCutUtils";
 import AutoHideInfo from "@/components/AutoHideInfo";
 import { createNamespacedHelpers } from "vuex";
@@ -113,6 +132,10 @@ export default {
     return {
       dataList: [],
       modifingId: 0,
+      showSearch: false,
+      queryParams:{
+        key: null
+      }
     };
   },
   created() {
@@ -147,8 +170,12 @@ export default {
       }
     },
     getList(setCurrent) {
-      getShortCut().then((data) => {
+      getShortCut(this.queryParams.key).then((data) => {
         this.dataList = data;
+        //超过10个就显示搜索按钮
+        if(this.dataList && this.dataList.length > 5 && !this.showSearch){
+           this.showSearch = true;
+        }
         // console.log(this.dataList);
         if (setCurrent) {
           this.$refs.shortCutTable.setCurrentRow(data[0]);
@@ -163,6 +190,27 @@ export default {
         }
       });
     },
+    handleOnMuchDelete() {
+      if(this.dataList && this.dataList.length > 0){
+         let ids = [];
+         this.dataList.forEach((item,index) => {
+            ids.push(item.id);
+         });
+         this.$confirm("是否确定清除当前 "+ids.length+" 条快捷数据?", "警告", {
+            confirmButtonText: "确定",
+            cancelButtonText: "取消",
+            type: "warning",
+          }).then(function () {
+            return removeMuchShortCut(ids);
+          }).then((response) => {
+            this.getList();
+            if (ids.indexOf(this.curShortCutObj.id) != -1) {
+              this.setCurShortCutObj({});
+            }
+          })
+          .catch(function () {});     
+      }
+    },
     handleOnCurrentChange(data) {
       this.setCurShortCutObj({ data });
     },

stdiet-ui/src/views/custom/recipesBuild/RecipesView/RecipesCom/index.vue

@@ -342,6 +342,9 @@
   </div>
 </template>
 <script>
+import {
+  getDishClassNameById 
+} from "@/api/custom/recipes";
 import { createNamespacedHelpers } from "vuex";
 const {
   mapActions,