菜品添加、查询优化

stdiet-ui/src/views/custom/dishes/index.vue

@@ -16,6 +16,17 @@
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
+      <el-form-item label="菜品种类" prop="dishClass">
+        <el-cascader
+          v-model="dishClassQueryParam"
+          :options="dishClassOptions"
+          :props="{ expandTrigger: 'hover' }"
+          :show-all-levels="true"
+          filterable
+          clearable
+          placeholder="请选择菜品种类"
+        ></el-cascader>
+      </el-form-item>
       <el-form-item label="菜品类型" prop="type">
         <el-select
           v-model="queryParams.type"
@@ -187,7 +198,7 @@
                   v-model="form.dishClass"
                   :options="dishClassOptions"
                   :props="{ expandTrigger: 'hover' }"
-                  placeholder="请输入菜品种类"
+                  placeholder="请选择菜品种类"
                   ></el-cascader>
               </el-form-item>
             </el-col>
@@ -453,15 +464,6 @@ export default {
       //
       cusWeightOptions: [],
       dishClassOptions: [],
-      /*
-      * {
-        value: 'zhinan',
-        label: '指南',
-        children: [{
-          value: 'shejiyuanze',
-          label: '设计原则'
-        }]
-      }*/
       dishClassBigOptions:[],
       dishClassSmallOptions:[],
       // 查询参数
@@ -470,11 +472,15 @@ export default {
         pageSize: 10,
         name: null,
         type: null,
+        bigClass: null,
+        smallClass: null
       },
       // 表单参数
       form: {},
       // 表单校验
       rules: {},
+      //菜品种类查询种类
+      dishClassQueryParam:[]
     };
   },
   created() {
@@ -506,6 +512,11 @@ export default {
     /** 查询菜品列表 */
     getList() {
       this.loading = true;
+      if(this.dishClassQueryParam != null && this.dishClassQueryParam.length > 0){
+        this.queryParams.smallClass = this.dishClassQueryParam[1];
+      }else{
+        this.queryParams.smallClass = null;
+      }
       listDishes(this.queryParams).then((response) => {
         this.dishesList = response.rows.map((d) => {
           const recTags = [],
@@ -621,6 +632,7 @@ export default {
     /** 重置按钮操作 */
     resetQuery() {
       this.resetForm("queryForm");
+      this.dishClassQueryParam = [];
       this.handleQuery();
     },
     // 多选框选中数据

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

@@ -71,7 +71,7 @@
             size="mini"
             type="primary"
             @click="handleOnSave"
-            >生成食谱</el-button
+            >生成食谱2</el-button
           >
         </span>
       </div>

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

@@ -15,6 +15,17 @@
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
+     <el-form-item label="菜品种类" prop="dishClass">
+        <el-cascader
+          filterable
+          clearable
+          v-model="dishClassQueryParam"
+          :options="dishClassOptions"
+          :props="{ expandTrigger: 'hover' }"
+          :show-all-levels="true"
+          placeholder="请选择菜品种类"
+        ></el-cascader>
+      </el-form-item>
       <el-form-item label="菜品类型" prop="type">
         <el-select
           :disabled="lockType"
@@ -54,6 +65,11 @@
       @current-change="handleCurrentChange"
     >
       <el-table-column label="菜品名称" align="center" prop="name" />
+      <el-table-column label="菜品种类" align="center" prop="bigClass">
+        <template slot-scope="scope">
+          <AutoHideMessage :data="dishClassFormat(scope.row)" :maxLength="10"></AutoHideMessage>
+        </template>
+      </el-table-column>
       <el-table-column label="菜品类型" align="center" prop="type">
         <template slot-scope="scope">
           <AutoHideInfo :data="typeFormat(scope.row)" />
@@ -90,9 +106,10 @@
 </template>
 <script>
 import AutoHideInfo from "@/components/AutoHideInfo";
+import AutoHideMessage from "@/components/AutoHideMessage";
 import { listDishes } from "@/api/custom/dishes";
 import { createNamespacedHelpers } from "vuex";
-const { mapState } = createNamespacedHelpers("recipes");
+const { mapState,mapGetters } = createNamespacedHelpers("recipes");
 export default {
   name: "SelectDishes",
   props: [],
@@ -107,15 +124,20 @@ export default {
         pageSize: 10,
         name: null,
         type: null,
+        smallClass: null,
+        bigClass: null,
         reviewStatus: "yes",
       },
+      //菜品种类查询参数
+      dishClassQueryParam:[]
     };
   },
   components: {
-    AutoHideInfo,
+    AutoHideInfo,AutoHideMessage
   },
   computed: {
-    ...mapState(["typeOptions"]),
+    ...mapState(["typeOptions","dishBigClassOptions","dishSmallClassOptions"]),
+    ...mapGetters(["dishClassOptions"]),
   },
   methods: {
     getList({ type }) {
@@ -124,6 +146,11 @@ export default {
         this.lockType = true;
         this.queryParams.type = type;
       }
+      if(this.dishClassQueryParam != null && this.dishClassQueryParam.length > 0){
+        this.queryParams.smallClass = this.dishClassQueryParam[1];
+      }else{
+        this.queryParams.smallClass = null;
+      }
       this.loading = true;
       listDishes(this.queryParams).then((result) => {
         this.dishesList = result.rows.map((d) => {
@@ -175,6 +202,7 @@ export default {
     },
     resetQuery() {
       this.resetForm("queryForm");
+      this.dishClassQueryParam = [];
       this.handleQuery();
     },
     typeFormat(row, column) {
@@ -184,6 +212,15 @@ export default {
             .split(",")
             .map((type) => this.selectDictLabel(this.typeOptions, type));
     },
+    //菜品种类翻译
+    dishClassFormat(row){
+       if(row.bigClass > 0 && row.smallClass > 0){
+         let bigClassName = this.selectDictLabel(this.dishBigClassOptions, row.bigClass);
+         let smallClassName = this.selectDictLabel(this.dishSmallClassOptions, row.smallClass);
+         return bigClassName+"/"+smallClassName;
+       }
+       return "";
+    },
   },
 };
 </script>